#intro-text {
  background-image:url("../../assets/img/image.jpg");
  height:70vh;
  width:100%;
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
  background-color:#ffffff;
  margin-bottom:25px;
  text-align: center;
}

#intro-text h1, #intro-text h2 {
  color: white;
  font-family: 'Petit Formal Script', cursive;
}

@media (max-width: 480px) {
  a#company-name.navbar-brand {
    font-size:14px;
  }
}

@media (min-width: 576px) {
  a#company-name.navbar-brand {
    font-size:16px;
  }
}

@media (max-width: 480px) {
  span#company-name-subscript {
    font-size: 10px;
  }
}

@media (min-width: 576px) {
  span#company-name-subscript {
    font-size: 14px;
  }
}

.navbar {
  padding: 0 1.3rem;
}

footer ul.list-inline li {
  display: inline-block;
}

footer ul.list {
  list-style: none;
  color: white;
}

section {
  background-attachment: fixed;
  background-position: center center;
  background-size: cover;
}

html {
  scroll-behavior: smooth;
}

/**
 * Disable smooth scrolling when users have prefers-reduced-motion enabled
 */
 @media screen and (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}

body {
  font-family: 'Open Sans', sans-serif;
}

.logo-image {
  height: 35px;
  width: 35px;
  margin-top: -5px;
  margin-right: 8px;
}

@media (max-width: 320px) {
  .logo-image {
    height: 50px;
    width: 20px;
    margin-top: -3px;
    margin-left: -10px;
    margin-right: 2px;
  }
}

a.nav-link:hover {
  color: #ffff !important;
  background-color: #f0134d;
  border-radius: 3px;
  padding-left: 10px;
}

a#navbarDropdown.nav-link, a.nav-link {
  font-size: 14px;
}

a.nav-link, a#company-name.navbar-brand,
section#history h3, section#values h3, section#mediation h3,
section#services h3, section#methods h3, section#chambers h3 {
  font-family: 'Libre Baskerville', serif;
}

.text-primary, a.nav-link {
  color: #000839 !important;
}

.text-red {
  color: #f0134d;
}

section#history, section#methods {
  text-align: justify;
  text-justify: inter-word;
}

img#contact-image {
  height: 7rem;
  width: 7rem;
  border-radius: 5px;
}

div#contact-card {
  margin-right: -10rem;
  height: 7.6rem;
  margin-left: 4rem;
}

#contact-card .card-body{
  padding: 0.3rem 0.3rem;
}

/*
@media (max-width: 1200px) {                  
  div#contact-card {
     display: none;
  }
}
*/

@media (max-width: 1200px) {                  
  div#contact-card {
    margin-right: auto;
    height: 7.6rem;
    margin-left: auto;
  }
}

.btn-red {
  color: #ffffff;
  background-color: #f0134d;
}

.btn-red:hover {
  color: #f0134d;
  background-color: #ffffff;
  border: 1px solid #f0134d;
}

.btn-blue{
  color: #ffffff;
  background-color: #000839;
}

.btn-blue:hover {
  color: #ffffff;
  background-color: #f0134d;
}

.bg-blue {
  background-color: #000839;
}

@media (min-width: 1000px) and (max-width: 1300px){                  
  div#contact-card {
    margin-right: -1rem;
    height: 7.6rem;
  }
}

#services hr, #mediation hr, #values hr, #message hr {
  margin-top: 1rem;
  margin-bottom: 1rem;
  border: 0;
  border-top: 1px solid #fff !important;
}

div#contacts {
  font-size: 14px;
  color: #ffffff;
  background-color: #000839;
}


div#contacts ul.list-inline.d-flex.flex-row {
  margin: 4px auto;
}

div#contacts a:hover{
  color: #ffffff;
}

@media (max-width: 768px) {
  #contacts ul.list-inline.d-flex.flex-row {
    -webkit-box-pack: center!important;
    -ms-flex-pack: center!important;
    justify-content: center!important;
  }
}

#glassy-text {
  text-align: center;
  padding: 15px 3px;
}

@supports (-webkit-backdrop-filter: none) or (backdrop-filter: none) {
  #glassy-text {
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    background-color: rgba(255, 255, 255, 0.07);
  }
}

img#side-image {
  height: 7.5rem;
  width: 7.5rem;
  border-radius: 5px;
  margin-bottom: 4px;
}

div#side-panel {
  width: 7.7rem;
  float: left;
  margin: 6px 2px 0 -3px;
  font-size: 13px;
}

@media (max-width: 900px){                  
  div#contact-card {
    display: none;
  }
}

@media (min-width: 900px){                  
  div#side-panel {
    display: none;
  }
}