@import url("color-palette.css");

div.section.center {
  margin-top: 60px;
}

.btn-seafoam-blue-two {
  background-color: var(--seafoam-blue-two);
  color: var(--white);
  font-family: 'Saira Extra Condensed', sans-serif;
	font-size: 20px;
	font-weight: 500;
	font-stretch: extra-condensed;
	line-height: 1.65;
	letter-spacing: 6.8px;
	text-align: center;
  cursor: pointer;
  padding: 25px;
  text-transform: uppercase;
  min-width: 25%;
}

.btn-seafoam-blue-two:hover{
  color: var(--white);
}

div.contact-us {
  margin-top: 30px;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
}

div.section.center hr {
	height: 3px;
	opacity: 0.13;
	border-top: solid 1px var(--white);
  min-width: 40%;
  margin: 60px 0;
}

.section.center.contact {
  display: flex;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
}

.section.center.contact div.contact {
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  justify-content: center;
  align-content: center;
  align-items: center;
  align-self: center;
  min-width: 25%;
}

.section.center.contact div.contact div.title {
  font-family: 'Saira Extra Condensed', sans-serif;
	font-size: 50px;
	font-weight: 300;
	font-stretch: extra-condensed;
	text-align: center;
	color: var(--white);
  text-transform: none;
}

.section.center.contact div.contact div.address,
.section.center.contact div.contact div.number {
	-webkit-transform: rotate(-360deg);
	transform: rotate(-360deg);
	font-family: 'Noto Sans', sans-serif;
	font-size: 20px;
	line-height: 1.6;
	text-align: center;
	color: var(--white);
}

.section.center.contact div.contact div.number {
  color: var(--robin-s-egg);
}

@media screen and (max-width: 575px) {
  .btn-seafoam-blue-two {
    min-width: 60%;
  }

  div.section.center hr {
    min-width: 80%;
  }

  .section.center.contact {
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
  }

  .section.center.contact div.contact:not(:first-child) {
    margin-top: 60px !important;
  }
}

@media screen and (min-width: 576px) and (max-width: 767px) {
  .btn-seafoam-blue-two {
    min-width: 50%;
  }

  div.section.center hr {
    min-width: 70%;
  }

  .section.center.contact {
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
  }

  .section.center.contact div.contact:not(:first-child) {
    margin-top: 60px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 991px) {
  .btn-seafoam-blue-two {
    min-width: 40%;
  }

  div.section.center hr {
    min-width: 60%;
  }

  .section.center.contact {
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
  }

  .section.center.contact div.contact:not(:first-child) {
    margin-top: 60px !important;
  }
}

@media screen and (min-width: 992px) and (max-width: 1199px) {
  .btn-seafoam-blue-two {
    min-width: 30%;
  }

  div.section.center hr {
    min-width: 50%;
  }
}

@media screen and (min-width: 1200px) {

}