/*
Theme Name: Sydney
Theme URI: https://athemes.com/theme/sydney
Author: aThemes
Author URI: https://athemes.com
Description: Sydney is a powerful business theme that provides a fast way for companies or freelancers to create an awesome online presence. As well as being fully compatible with Elementor, Sydney brings plenty of customization possibilities like access to all Google Fonts, full color control, layout control, logo upload, full screen slider, header image, sticky navigation and much more. Also, Sydney provides all the construction blocks you need to rapidly create an engaging front page. Looking for a quick start with Sydney? With just a few clicks, you can import one of our existing demos (https://athemes.com/sydney-demos/)
Version: 2.17
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tested up to: 5.9
Requires PHP: 5.6
Text Domain: sydney
Tags: two-columns, right-sidebar, block-styles, custom-colors, custom-background, custom-header, custom-menu, featured-images, sticky-post, theme-options, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
Sydney is based on Underscores http://underscores.me/, (C) 2012-2015 Automattic, Inc.
*//*
Theme Name:   Udruzenje oboljelih od raka prostate
Theme URI:    http://example.com/twenty-fifteen-child/
Description:  Udruzenje obol...
Author:       Emir Vranac
Author URI:   http://example.com
Template:     sydney
Version:      1.0.0
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
Text Domain:  uorp_child
*/

/* Variables */
:root {
  --uorp-green: #9cc952;
  --uorp-green-opacity: rgba(155, 201, 82, 0.69);
  --uorp-light-blue: #89d4f1;
  --uorp-normal-blue: #418dc9;
  --uorp-dark-blue: #1d1e38;
  --white: #fff;
  --poppins: 'Poppins', sans-serif;
  --tt-gilroy-medium: 'Gilroy-Medium', sans-serif;
  --tt-gilroy-bold: 'Gilroy-Bold', sans-serif;
}

/* Wrappers */
.grid-wrapper {
  display: grid;
  grid-template-columns: repeat(2, 4fr);
  column-gap: 2rem;
  width: 100%;
  padding: 0 25px;
  margin-top: 60px;
}

/* Components */
.title {
  color: var(--white);
  font-family: var(--poppins);
  font-weight: bold;
  font-size: 2rem;
  line-height: 1;
}

@media (max-width: 768px) {
  .carousel-sm-title {
    color: var(--white);
    font-family: var(--poppins);
    font-weight: bold;
    font-size: 2rem;    
    line-height: 1;
  }
}

.row-gutter {
  margin-top: 60px !important;
}

.big-margin-top {
  margin-top: 150px;
}


@media screen and (min-width: 768px) and (max-width: 1023px) {
  .center-image {
    text-align: center;
  }

  .center-title {
    text-align: center;
  }
}

.subtitle {
  font-family: var(--poppins);
  font-weight: bold;
  color: var(--white);
  margin-bottom: 0;
}

.paragraph {
  color: var(--white);
  font-family: var(--tt-gilroy-medium);
  font-size: 16px;
  line-height: normal;
}

.subsection-title {
  font-family: var(--poppins);
  font-weight: bold;
  color: var(--white);
}

.subsection-subtitle {
  margin-top: 30px;
  font-size: 16px;
  font-family: var(--poppins);
  font-weight: bold;
  color: var(--white);
}

.btn {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #134d7996;
  padding: 0;
  border: 3px solid var(--uorp-green-opacity);
  border-radius: 5px;
  text-decoration: none;
  margin-top: 12px;
}

.btn:hover {
  background-color: var(--uorp-green-opacity);
  color: var(--white);
  transition: all ease-out 0.3s;
}

.btn-txt {
  width: 70%;
  text-align: center;
  color: var(--white);
  text-transform: uppercase;
  margin-right: 10px;
}

.btn-arrow {
  width: 50px;
  height: 50px;
  background-color: var(--uorp-green-opacity);
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--white);
}

@media (max-width: 768px) {
  .btn-arrow-sm {
    width: 50px;
    height: 30px;
    background-color: var(--uorp-green-opacity);
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--white);
  }

  .btn-txt-sm {
    font-size: 14px;
  }
}



.read-more-btn {
  width: 40%;
}

@media screen and (min-width: 320px) and (max-width: 426px) {
  .read-more-btn {
    width: 60%;
    margin: 0 auto;
  }
}

@media screen and (min-width: 426px) and (max-width: 991px) {
  .read-more-btn {
    width: 40%;
    margin: 0 auto;
  }
}

.go-to-blog-btn {
  width: 20% !important;
  padding-left: 0 !important;
  margin-top: 20px !important;
}

.list {
  margin-left: 15px;
  padding-left: 0;
}


.list li:not(:last-child) {
  margin-bottom: 11px;
}

.ordered-list li {
  padding-left: 5px;
}

.roman {
  list-style: upper-roman;
}

.decimal {
  list-style: decimal;
}

.highlighted {
  color: var(--uorp-green);
  font-weight: bold;
  font-family: var(--poppins);
  font-size: 30px;
}

.highlighted-contact {
  color: var(--uorp-green);
  font-weight: bold;
  font-family: var(--poppins);
}

/* Page container */
body.page-template-contact .page-wrap {
  height: 100vh !important;
}

#page {
  background-color: #134c79;
}

/* Main header */
body.home .main-header {
  background-image: url(https://www.uorp.ba/wp-content/uploads/2023/01/UORP-WEB-SITE-DESIGN-landing-page-pozadina.png) !important;
  background-position-y: 800px;
}

.main-header {
  background-color: #134c79 !important;
}

.nav-menu li a {
  font-family: var(--tt-gilroy-bold);
  font-size: 15px;
}

#masthead-mobile .container-fluid .row.valign .col-grow-mobile.col-sm-4 {
  width: 70%
}

#masthead-mobile .container-fluid .row.valign .col-grow-mobile.col-sm-8 {
  width: 30%
}

#masthead .row.valign .header-col {
  width: 50%
}

@media (max-width: 1200px) {
  #mainnav ul li {
    padding: 0px 8px !important;
  }

  #mainnav ul li a {
    font-size: 12px;
  }
}

/* Hero area */
.sydney-hero-area {
  height: 680px;
  background-image: url(https://www.uorp.ba/wp-content/uploads/2023/01/UORP-WEB-SITE-DESIGN-landing-page-pozadina.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position-y: bottom;
  display: flex;
  align-items: center;
}

.header-image {
  height: 0 !important;
}

/* Carousel */

/* My classes for carousel */

.text-area-dynamic {
  margin: auto;
}

.carousel-btn {
  margin-right: 340px;
  margin-top: 30px;
}

@media screen and (max-width: 992px) {
  #static-carousel-slide {
    margin-top: 20px;
  }

  .owl-carousel .grid-wrapper {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
    height: 800px;
    align-items: center;
    justify-content: center;
  }

  .owl-carousel .grid-wrapper .text-area .title {
    text-align: center;
  }

  .owl-carousel .grid-wrapper .image-area {
    display: none;
  }

  .owl-carousel .grid-wrapper .text-area .btn {
    margin: 20px auto 0 auto;
    width: 60%;
  }
}

@media screen and (min-width: 992px) {
  #static-carousel-slide .image-area {
    margin-top: 140px;
    width: 500px;
  }

 
  #static-carousel-slide .text-area {
    margin-top: 130px;
  }

  #dynamic-carousel-slide {
    margin-top: 0px;
  }
}

@media screen and (min-width: 768px) and (max-width: 992px) {
  .owl-carousel .grid-wrapper .text-area .btn {
    margin: 40px auto 0 auto;
    width: 30%;
  }
}

/* Library classes for carousel */
.owl-item {
  height: 0;
}

.owl-item.active {
  height: auto;
}

.owl-dots {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  position: absolute;
  padding-left: 1.5em;
  top: 50% !important;
  right: -20px;
  transform: translateY(-50%) !important;
  margin-top: 0 !important;
}

@media (max-width: 992px) {
  .owl-dots{
    display: none !important;
  }
}

.owl-dots .owl-dot.active {
  background-color: #9cc952;
  height: 5px;
  margin-right: 5px;
  border-radius: 20%;
}

.owl-dots .owl-dot.active span {
  opacity: 0;
  margin-top: 2px;
}

/* About Us area*/
.about-post-container {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.left-image-area-about-us {
  display: flex;
  align-items: flex-start;
  justify-content: center;
}

.left-image-area-about-us img{
  align-self: flex-start;
}

.about-item {
  width: 100%;
}

@media screen and (min-width: 320px) and (max-width: 992px) {
  .about-item {
    width: 100%;
  }

  .about-item .title {
    text-align: center;
  }
}

.about-item-details {
  width: 100%;
  display: flex;
  flex-direction: column;
  margin-bottom: 10px;
}

@media screen and (min-width: 320px) and (max-width: 767px) {
  .about-item-details {
    width: 100%;
  }
}

.title-container {
  width: 100%;
  display: flex;
  align-items: center;
  padding: .3em .3em 0 .3em;
  border: 3px solid var(--uorp-green-opacity);
}

.arrow-container {
  display: flex;
  justify-content: end;
  padding-right: .5em;
}

.arrow {
  color: var(--uorp-green-opacity);
}

.up-arrow {
  position: relative;
  right: 10px;
  color: var(--white);
}

.title-container:hover {
  background-color: var(--uorp-green-opacity);
  cursor: pointer;
  transition: all ease-out 0.3s;
}

.title-container:hover .arrow-container .arrow {
  color: var(--white);
}

.title-container-active {
  background-color: var(--uorp-green-opacity);
  margin: 0;
  border: 3px solid #9bc95200;
  transition: all .5s ease-in;
}

.about-details-subtitle {
  width: 100%;
  color: var(--white);
  margin: 0;
  padding: .3em;
  font-family: 'Gilroy-Bold', sans-serif;
  font-size: 12px;
  text-transform: uppercase;
}

.about-details-paragraph {
  background-color: var(--uorp-green-opacity);
  margin-top: 0;
  line-height: normal;
  height: auto;
}

.about-details-paragraph.hidden{
  height: 0 !important;
}

.about-details-paragraph ul li:not(:last-child) {
  margin-bottom: 11px;
}

.hidden {
  visibility: hidden;
}

/* Partners */

.partner {
  height: 316px;
  background-color: var(--uorp-normal-blue);
  box-shadow: 0px 11px 30.08px 1.92px rgba(8, 21, 41, 0.3);
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  
}

.partner img {
  width: 300px;
  height: 300px;
	position: absolute;
  top: 30%;
  left: 35%;
  transform: translateX(-30%) translateY(-30%);
} 
.partner:hover {
  transform: scale(1.1);
  transition: all .5s ease-out;
}

.partner-intro {
  height: 316px;
  background-color: #418ec900;
}

.partner-intro .title {
  position: absolute;
  top: 0;
  margin: 0;
  padding: 0;
}

.partner-intro .paragraph {
  position: absolute;
  left: 3px;
  top: 50%;
  transform: translate(0, -50%);
}

/* Footer */

.site-footer {
  background-color: var(--uorp-dark-blue);
  position: relative;
  bottom: 0;
}

.site-info .image-area {
  position: absolute;
  right: 0;
  bottom: 0;
}

.footer-img {
  position: absolute;
  right: 220px;
  bottom: 0;
}

.footer-img-extension {
  width: 340px;
  background-color: var(--uorp-normal-blue);
  position: absolute;
  right: 0;
  bottom: 0;
}

.logo-and-social {
  display: flex;
  justify-content: space-between;
}

.social-profile {
  margin: 20px 50px 20px 20px;
}


.footer-contact {
  display: flex;
  justify-content: space-around;
  margin-left: 50px;
}


@media screen and (min-width: 320px) and (max-width: 425px) {
  .logo-and-social img {
    width: 200px;
    margin-left: -40px;
  }
}

@media screen and (max-width: 991px) {
  .footer-img {
    display: none;
  }

  .footer-img-extension {
    display: none;
  }

  .logo-and-social {
    flex-direction: column;
    align-items: center;
  }

  .logo-and-social img {
    margin-left: -50px;
  }

  .footer-contact {
    flex-direction: column;
    align-items: center;
    margin-left: 0;
  }
}


@media screen and (max-width: 1439px) {
  .social-profile {
    margin: 10px;
  }

  .footer-contact {
    margin: 10px auto 0 10px;
  }

  .footer-img {
    right: 0;
    width: 445px;
  }

  .footer-img-extension {
    display: none;
  }
}

/*Prostate cancer*/

.my-card {
  background-color: var(--uorp-normal-blue);
  border-radius: 5px;
}

#biopsy .image-area {
  row-gap: 60px;
}

/* Testicualr cancer */

#testicles-about .highlighted {
  margin-top: 220px;
}

#self-examination .image-area {
  align-self: flex-end;
}

@media screen and (min-width: 320px) and (max-width: 767px) {
  #testicles-about .highlighted {
    margin-top: 20px;
  }

  #self-examination .title {
    font-size: 40px;
  }
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
  #testicles-about .highlighted {
    margin-top: 20px;
  }
}

@media screen and (min-width: 1024px) and (max-width: 1439px) {
  #testicles-about .highlighted {
    margin-top: 60px;
  }
}

.blog-post-desc {
  align-self: center;
}

.load-btn-container {
  display: flex;
  justify-content: center;
}

.load-btn {
  width: 20%;
  margin: 0 auto;
  text-align: center;
  background-color: #134d7996;
  border: 3px solid var(--uorp-green-opacity);
  border-radius: 5px;
}

@media screen and (min-width: 319px) and (max-width: 768px) {
  .load-btn {
    width: 90%;
    margin-top: 60px;
  }
}

@media screen and (min-width: 767px) and (max-width: 1024px) {
  .load-btn {
    width: 50%;
    margin-top: 80px;
  }
}

.load-btn:hover {
  background-color: var(--uorp-green-opacity);
  color: var(--white);
  transition: all ease-out 0.3s;
}

.post-text-area p {
  color: #fff !important;
  font-family: var(--tt-gilroy-medium);
  font-size: 16px;
  line-height: normal;
}

#no-img-post .go-to-blog-btn {
  width: 45%;
}

.image-gallery-wrapper {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 2rem;
}

.post-image {
  cursor: pointer;
}

@media screen and (max-width: 991px) {
  .post-image-area {
    display: none;
  }
}

@media screen and (min-width: 320px) and (max-width: 767px) {
  .go-to-blog-btn {
    padding-left: 0 !important;
    width: 80% !important;
    margin: 40px auto 0 auto !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1439px) {
  .go-to-blog-btn {
    padding-left: 0 !important;
    width: 40% !important;
    margin: 40px auto 0 auto !important;
  }
}

/* The Modal (background) */
.modal {
  display: none;
  position: fixed;
  z-index: 999;
  padding-top: 100px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: #1d1e38d6;
}

/*Modal Content*/
.modal-content {
  position: relative;
  margin: auto;
  padding: 0;
  width: 90%;
  max-width: 1200px;
}

/* The Close Button */
.close {
  color: var(--white);
  position: absolute;
  top: 10px;
  right: 25px;
  font-size: 35px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: var(--uorp-green);
  text-decoration: none;
  cursor: pointer;
}

/* Hide the slides by default */
.my-slides {
  display: none;
  text-align: center;
}

/* Next & previous buttons */
.prev,
.next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -50px;
  color: var(--white);
  font-weight: bold;
  font-size: 20px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
  -webkit-user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover,
.next:hover {
  background-color: var(--uorp-green-opacity);
}

/* Number text */
.numbertext {
  color: #f2f2f2;
  font-size: 18px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

img.hover-shadow {
  transition: 0.3s;
}

.hover-shadow:hover {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}


/* Membership Page */
.access-card-container {
  text-align: center;
  border: 20px solid var(--uorp-normal-blue);
  box-shadow: 0px 11px 30.08px 1.92px rgba(8, 21, 41, 0.3);
  border-radius: 10px;
  padding-top: 15px;
}

@media screen and (min-width: 320px) and (max-width: 424px) {
  .access-card-container .title {
    font-size: 35px;
  }
}

@media screen and (min-width: 425px) and (max-width: 767px) {
  .access-card-container .title {
    font-size: 40px;
  }
}

@media screen and (min-width: 320px) and (max-width: 1023px) {
  #membership-intro .title,
  #membership-intro .highlighted {
    text-align: center;
  }
}

/* Contact Page */

.contact-logo-img {
  height: auto;
  width: 50%;
  position: absolute;
  top: -50px;
}
span.wpcf7-list-item { display: table-row; }
span.wpcf7-list-item * { display: table-cell; }

/* Google translate bar */
iframe.goog-te-banner-frame {
  display: none !important;
}

body {
  top: 0px !important;
}


.goog-logo-link,
.goog-te-gadget span {
  display: none !important;
}

.language-switcher select.goog-te-combo {
  background-color: #8BC34A;
  color: white;
  border: none;
  padding: 8px 14px;
  font-size: 14px;
  cursor: pointer;
  border-radius: 4px;
  margin: 10px;
}

.language-switcher {
  background-color: #005792;
  padding: 10px 20px;
  text-align: right;
  position: relative;
  z-index: 9999;
}

.fixed-bottom-right {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 9999;
}

.disclamer {
  margin-bottom: 0;
  color: #f2f2f2;
  font-weight: bold;
}/*
Theme Name:   Udruzenje oboljelih od raka prostate
Theme URI:    http://example.com/twenty-fifteen-child/
Description:  Udruzenje obol...
Author:       Emir Vranac
Author URI:   http://example.com
Template:     sydney
Version:      1.0.0
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
Text Domain:  uorp_child
*/

/* Variables */
:root {
  --uorp-green: #9cc952;
  --uorp-green-opacity: rgba(155, 201, 82, 0.69);
  --uorp-light-blue: #89d4f1;
  --uorp-normal-blue: #418dc9;
  --uorp-dark-blue: #1d1e38;
  --white: #fff;
  --poppins: 'Poppins', sans-serif;
  --tt-gilroy-medium: 'Gilroy-Medium', sans-serif;
  --tt-gilroy-bold: 'Gilroy-Bold', sans-serif;
}

/* Wrappers */
.grid-wrapper {
  display: grid;
  grid-template-columns: repeat(2, 4fr);
  column-gap: 2rem;
  width: 100%;
  padding: 0 25px;
  margin-top: 60px;
}

/* Components */
.title {
  color: var(--white);
  font-family: var(--poppins);
  font-weight: bold;
  font-size: 2rem;
  line-height: 1;
}

@media (max-width: 768px) {
  .carousel-sm-title {
    color: var(--white);
    font-family: var(--poppins);
    font-weight: bold;
    font-size: 2rem;    
    line-height: 1;
  }
}

.row-gutter {
  margin-top: 60px !important;
}

.big-margin-top {
  margin-top: 150px;
}


@media screen and (min-width: 768px) and (max-width: 1023px) {
  .center-image {
    text-align: center;
  }

  .center-title {
    text-align: center;
  }
}

.subtitle {
  font-family: var(--poppins);
  font-weight: bold;
  color: var(--white);
  margin-bottom: 0;
}

.paragraph {
  color: var(--white);
  font-family: var(--tt-gilroy-medium);
  font-size: 16px;
  line-height: normal;
}

.subsection-title {
  font-family: var(--poppins);
  font-weight: bold;
  color: var(--white);
}

.subsection-subtitle {
  margin-top: 30px;
  font-size: 16px;
  font-family: var(--poppins);
  font-weight: bold;
  color: var(--white);
}

.btn {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #134d7996;
  padding: 0;
  border: 3px solid var(--uorp-green-opacity);
  border-radius: 5px;
  text-decoration: none;
  margin-top: 12px;
}

.btn:hover {
  background-color: var(--uorp-green-opacity);
  color: var(--white);
  transition: all ease-out 0.3s;
}

.btn-txt {
  width: 70%;
  text-align: center;
  color: var(--white);
  text-transform: uppercase;
  margin-right: 10px;
}

.btn-arrow {
  width: 50px;
  height: 50px;
  background-color: var(--uorp-green-opacity);
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--white);
}

@media (max-width: 768px) {
  .btn-arrow-sm {
    width: 50px;
    height: 30px;
    background-color: var(--uorp-green-opacity);
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--white);
  }

  .btn-txt-sm {
    font-size: 14px;
  }
}



.read-more-btn {
  width: 40%;
}

@media screen and (min-width: 320px) and (max-width: 426px) {
  .read-more-btn {
    width: 60%;
    margin: 0 auto;
  }
}

@media screen and (min-width: 426px) and (max-width: 991px) {
  .read-more-btn {
    width: 40%;
    margin: 0 auto;
  }
}

.go-to-blog-btn {
  width: 20% !important;
  padding-left: 0 !important;
  margin-top: 20px !important;
}

.list {
  margin-left: 15px;
  padding-left: 0;
}


.list li:not(:last-child) {
  margin-bottom: 11px;
}

.ordered-list li {
  padding-left: 5px;
}

.roman {
  list-style: upper-roman;
}

.decimal {
  list-style: decimal;
}

.highlighted {
  color: var(--uorp-green);
  font-weight: bold;
  font-family: var(--poppins);
  font-size: 30px;
}

.highlighted-contact {
  color: var(--uorp-green);
  font-weight: bold;
  font-family: var(--poppins);
}

/* Page container */
body.page-template-contact .page-wrap {
  height: 100vh !important;
}

#page {
  background-color: #134c79;
}

/* Main header */
body.home .main-header {
  background-image: url(https://www.uorp.ba/wp-content/uploads/2023/01/UORP-WEB-SITE-DESIGN-landing-page-pozadina.png) !important;
  background-position-y: 800px;
}

.main-header {
  background-color: #134c79 !important;
}

.nav-menu li a {
  font-family: var(--tt-gilroy-bold);
  font-size: 15px;
}

#masthead-mobile .container-fluid .row.valign .col-grow-mobile.col-sm-4 {
  width: 70%
}

#masthead-mobile .container-fluid .row.valign .col-grow-mobile.col-sm-8 {
  width: 30%
}

#masthead .row.valign .header-col {
  width: 50%
}

@media (max-width: 1200px) {
  #mainnav ul li {
    padding: 0px 8px !important;
  }

  #mainnav ul li a {
    font-size: 12px;
  }
}

/* Hero area */
.sydney-hero-area {
  height: 680px;
  background-image: url(https://www.uorp.ba/wp-content/uploads/2023/01/UORP-WEB-SITE-DESIGN-landing-page-pozadina.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position-y: bottom;
  display: flex;
  align-items: center;
}

.header-image {
  height: 0 !important;
}

/* Carousel */

/* My classes for carousel */

.text-area-dynamic {
  margin: auto;
}

.carousel-btn {
  margin-right: 340px;
  margin-top: 30px;
}

@media screen and (max-width: 992px) {
  #static-carousel-slide {
    margin-top: 20px;
  }

  .owl-carousel .grid-wrapper {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
    height: 800px;
    align-items: center;
    justify-content: center;
  }

  .owl-carousel .grid-wrapper .text-area .title {
    text-align: center;
  }

  .owl-carousel .grid-wrapper .image-area {
    display: none;
  }

  .owl-carousel .grid-wrapper .text-area .btn {
    margin: 20px auto 0 auto;
    width: 60%;
  }
}

@media screen and (min-width: 992px) {
  #static-carousel-slide .image-area {
    margin-top: 140px;
    width: 500px;
  }

 
  #static-carousel-slide .text-area {
    margin-top: 130px;
  }

  #dynamic-carousel-slide {
    margin-top: 0px;
  }
}

@media screen and (min-width: 768px) and (max-width: 992px) {
  .owl-carousel .grid-wrapper .text-area .btn {
    margin: 40px auto 0 auto;
    width: 30%;
  }
}

/* Library classes for carousel */
.owl-item {
  height: 0;
}

.owl-item.active {
  height: auto;
}

.owl-dots {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  position: absolute;
  padding-left: 1.5em;
  top: 50% !important;
  right: -20px;
  transform: translateY(-50%) !important;
  margin-top: 0 !important;
}

@media (max-width: 992px) {
  .owl-dots{
    display: none !important;
  }
}

.owl-dots .owl-dot.active {
  background-color: #9cc952;
  height: 5px;
  margin-right: 5px;
  border-radius: 20%;
}

.owl-dots .owl-dot.active span {
  opacity: 0;
  margin-top: 2px;
}

/* About Us area*/
.about-post-container {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.left-image-area-about-us {
  display: flex;
  align-items: flex-start;
  justify-content: center;
}

.left-image-area-about-us img{
  align-self: flex-start;
}

.about-item {
  width: 100%;
}

@media screen and (min-width: 320px) and (max-width: 992px) {
  .about-item {
    width: 100%;
  }

  .about-item .title {
    text-align: center;
  }
}

.about-item-details {
  width: 100%;
  display: flex;
  flex-direction: column;
  margin-bottom: 10px;
}

@media screen and (min-width: 320px) and (max-width: 767px) {
  .about-item-details {
    width: 100%;
  }
}

.title-container {
  width: 100%;
  display: flex;
  align-items: center;
  padding: .3em .3em 0 .3em;
  border: 3px solid var(--uorp-green-opacity);
}

.arrow-container {
  display: flex;
  justify-content: end;
  padding-right: .5em;
}

.arrow {
  color: var(--uorp-green-opacity);
}

.up-arrow {
  position: relative;
  right: 10px;
  color: var(--white);
}

.title-container:hover {
  background-color: var(--uorp-green-opacity);
  cursor: pointer;
  transition: all ease-out 0.3s;
}

.title-container:hover .arrow-container .arrow {
  color: var(--white);
}

.title-container-active {
  background-color: var(--uorp-green-opacity);
  margin: 0;
  border: 3px solid #9bc95200;
  transition: all .5s ease-in;
}

.about-details-subtitle {
  width: 100%;
  color: var(--white);
  margin: 0;
  padding: .3em;
  font-family: 'Gilroy-Bold', sans-serif;
  font-size: 12px;
  text-transform: uppercase;
}

.about-details-paragraph {
  background-color: var(--uorp-green-opacity);
  margin-top: 0;
  line-height: normal;
  height: auto;
}

.about-details-paragraph.hidden{
  height: 0 !important;
}

.about-details-paragraph ul li:not(:last-child) {
  margin-bottom: 11px;
}

.hidden {
  visibility: hidden;
}

/* Partners */

.partner {
  height: 316px;
  background-color: var(--uorp-normal-blue);
  box-shadow: 0px 11px 30.08px 1.92px rgba(8, 21, 41, 0.3);
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  
}

.partner img {
  width: 300px;
  height: 300px;
	position: absolute;
  top: 30%;
  left: 35%;
  transform: translateX(-30%) translateY(-30%);
} 
.partner:hover {
  transform: scale(1.1);
  transition: all .5s ease-out;
}

.partner-intro {
  height: 316px;
  background-color: #418ec900;
}

.partner-intro .title {
  position: absolute;
  top: 0;
  margin: 0;
  padding: 0;
}

.partner-intro .paragraph {
  position: absolute;
  left: 3px;
  top: 50%;
  transform: translate(0, -50%);
}

/* Footer */

.site-footer {
  background-color: var(--uorp-dark-blue);
  position: relative;
  bottom: 0;
}

.site-info .image-area {
  position: absolute;
  right: 0;
  bottom: 0;
}

.footer-img {
  position: absolute;
  right: 220px;
  bottom: 0;
}

.footer-img-extension {
  width: 340px;
  background-color: var(--uorp-normal-blue);
  position: absolute;
  right: 0;
  bottom: 0;
}

.logo-and-social {
  display: flex;
  justify-content: space-between;
}

.social-profile {
  margin: 20px 50px 20px 20px;
}


.footer-contact {
  display: flex;
  justify-content: space-around;
  margin-left: 50px;
}


@media screen and (min-width: 320px) and (max-width: 425px) {
  .logo-and-social img {
    width: 200px;
    margin-left: -40px;
  }
}

@media screen and (max-width: 991px) {
  .footer-img {
    display: none;
  }

  .footer-img-extension {
    display: none;
  }

  .logo-and-social {
    flex-direction: column;
    align-items: center;
  }

  .logo-and-social img {
    margin-left: -50px;
  }

  .footer-contact {
    flex-direction: column;
    align-items: center;
    margin-left: 0;
  }
}


@media screen and (max-width: 1439px) {
  .social-profile {
    margin: 10px;
  }

  .footer-contact {
    margin: 10px auto 0 10px;
  }

  .footer-img {
    right: 0;
    width: 445px;
  }

  .footer-img-extension {
    display: none;
  }
}

/*Prostate cancer*/

.my-card {
  background-color: var(--uorp-normal-blue);
  border-radius: 5px;
}

#biopsy .image-area {
  row-gap: 60px;
}

/* Testicualr cancer */

#testicles-about .highlighted {
  margin-top: 220px;
}

#self-examination .image-area {
  align-self: flex-end;
}

@media screen and (min-width: 320px) and (max-width: 767px) {
  #testicles-about .highlighted {
    margin-top: 20px;
  }

  #self-examination .title {
    font-size: 40px;
  }
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
  #testicles-about .highlighted {
    margin-top: 20px;
  }
}

@media screen and (min-width: 1024px) and (max-width: 1439px) {
  #testicles-about .highlighted {
    margin-top: 60px;
  }
}

.blog-post-desc {
  align-self: center;
}

.load-btn-container {
  display: flex;
  justify-content: center;
}

.load-btn {
  width: 20%;
  margin: 0 auto;
  text-align: center;
  background-color: #134d7996;
  border: 3px solid var(--uorp-green-opacity);
  border-radius: 5px;
}

@media screen and (min-width: 319px) and (max-width: 768px) {
  .load-btn {
    width: 90%;
    margin-top: 60px;
  }
}

@media screen and (min-width: 767px) and (max-width: 1024px) {
  .load-btn {
    width: 50%;
    margin-top: 80px;
  }
}

.load-btn:hover {
  background-color: var(--uorp-green-opacity);
  color: var(--white);
  transition: all ease-out 0.3s;
}

.post-text-area p {
  color: #fff !important;
  font-family: var(--tt-gilroy-medium);
  font-size: 16px;
  line-height: normal;
}

#no-img-post .go-to-blog-btn {
  width: 45%;
}

.image-gallery-wrapper {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 2rem;
}

.post-image {
  cursor: pointer;
}

@media screen and (max-width: 991px) {
  .post-image-area {
    display: none;
  }
}

@media screen and (min-width: 320px) and (max-width: 767px) {
  .go-to-blog-btn {
    padding-left: 0 !important;
    width: 80% !important;
    margin: 40px auto 0 auto !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1439px) {
  .go-to-blog-btn {
    padding-left: 0 !important;
    width: 40% !important;
    margin: 40px auto 0 auto !important;
  }
}

/* The Modal (background) */
.modal {
  display: none;
  position: fixed;
  z-index: 999;
  padding-top: 100px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: #1d1e38d6;
}

/*Modal Content*/
.modal-content {
  position: relative;
  margin: auto;
  padding: 0;
  width: 90%;
  max-width: 1200px;
}

/* The Close Button */
.close {
  color: var(--white);
  position: absolute;
  top: 10px;
  right: 25px;
  font-size: 35px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: var(--uorp-green);
  text-decoration: none;
  cursor: pointer;
}

/* Hide the slides by default */
.my-slides {
  display: none;
  text-align: center;
}

/* Next & previous buttons */
.prev,
.next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -50px;
  color: var(--white);
  font-weight: bold;
  font-size: 20px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
  -webkit-user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover,
.next:hover {
  background-color: var(--uorp-green-opacity);
}

/* Number text */
.numbertext {
  color: #f2f2f2;
  font-size: 18px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

img.hover-shadow {
  transition: 0.3s;
}

.hover-shadow:hover {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}


/* Membership Page */
.access-card-container {
  text-align: center;
  border: 20px solid var(--uorp-normal-blue);
  box-shadow: 0px 11px 30.08px 1.92px rgba(8, 21, 41, 0.3);
  border-radius: 10px;
  padding-top: 15px;
}

@media screen and (min-width: 320px) and (max-width: 424px) {
  .access-card-container .title {
    font-size: 35px;
  }
}

@media screen and (min-width: 425px) and (max-width: 767px) {
  .access-card-container .title {
    font-size: 40px;
  }
}

@media screen and (min-width: 320px) and (max-width: 1023px) {
  #membership-intro .title,
  #membership-intro .highlighted {
    text-align: center;
  }
}

/* Contact Page */

.contact-logo-img {
  height: auto;
  width: 50%;
  position: absolute;
  top: -50px;
}
span.wpcf7-list-item { display: table-row; }
span.wpcf7-list-item * { display: table-cell; }

/* Google translate bar */
iframe.goog-te-banner-frame {
  display: none !important;
}

body {
  top: 0px !important;
}


.goog-logo-link,
.goog-te-gadget span {
  display: none !important;
}

.language-switcher select.goog-te-combo {
  background-color: #8BC34A;
  color: white;
  border: none;
  padding: 8px 14px;
  font-size: 14px;
  cursor: pointer;
  border-radius: 4px;
  margin: 10px;
}

.language-switcher {
  background-color: #005792;
  padding: 10px 20px;
  text-align: right;
  position: relative;
  z-index: 9999;
}

.fixed-bottom-right {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 9999;
}

.disclamer {
  margin-bottom: 0;
  color: #f2f2f2;
  font-weight: bold;
}