/* Created by: Fadi Findakly
Date: Oct. 20, 2020 */


/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* Global CSS variables */
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
:root {
  /* Colours */
  --orange-colour: #ef6e30;
  --light-background-colour1: #f8f8f8;
  --light-background-colour2: #f2f1f0;
  --dark-background-colour: #343a40;
  --white-colour: #ffffff;
  --black-colour: #000000;
}

/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* Shared styles */
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
.orange {
  color: var(--orange-colour);
}

a:hover, a:link, a:visited, a:active {
  color: var(--orange-colour);
}

body {
  font-size: 1.1rem;
}

/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* Nav and Carousel Styles */
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
.carousel-item {
  height: 450px;
}

.carousel-image-1 {
  background: url(../images/image1.jpg);
  background-size: cover;
}

.carousel-image-2 {
  background: url(../images/image2.jpg);
  background-size: cover;
}

.carousel-image-3 {
  background: url(../images/image3.jpg);
  background-size: cover;
}

#carousel-bold-content {
  font-weight: bold;
}

/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* About section styles */
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
div#about {
  background-color: var(--light-background-colour1);
}

div#about h3 {
  background-color: var(--light-background-colour2);
}

div#about img {
  box-shadow: 0px 5px 2px var(--orange-colour);
  width: 100%;
}

div.subtitle {
  color: var(--orange-colour);
  font-family: 'Allan', cursive;
  font-size: 2rem;
  position: relative;
}

div#about h3, div#about-content {
  padding-left: 30px;
}
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* Services section styles */
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
div#services {
  background-color: var(--dark-background-colour);
  padding: 20px 0;
}

div.service-cards {
  background-color: var(--orange-colour);
}

div.service-cards img {
  width: 100%;
  height: 160px;
}

div.service-cards:hover {
  box-shadow: 0px 0px 5px var(--white-colour);
}
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* Projects section styles */
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
div.project {
  padding: 5px;
  box-sizing: border-box;
  background-color: var(--light-background-colour2);
  border-radius: 2px;
}
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* Testimonial section styles */
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
div.testimony {
  background-color: var(--white-colour);
  border-radius: 3px;
}

div.testimony .circle {
  position: relative;
  bottom: 15px;
  width: 30px;
  height: 30px;
  background-color: var(--orange-colour);
  border-radius: 15px;
}

div.testimony .circle i {
  color: var(--white-colour);
}

span.customers {
  color: #343a40;
  font-weight: bold;
}

.stars {
  color: var(--orange-colour);
}

.dates {
  font-size: 0.8rem;
  font-style: italic;
}
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* Contact section styles */
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
#contact {
  background-color: var(--light-background-colour2);
}

.social-media-icons {
  color: var(--orange-colour);
}

div#contact {
  font-size: 1rem !important;
}
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* Pages links styles */
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.projects-btn {
  background-color: var(--dark-background-colour);
}

.projects-btn:active i, .projects-btn:link i, .projects-btn:visited i {
  color: var(--orange-colour);
}

.projects-btn:hover i {
  transform: scale(1.5, 1.5);
  transition-duration: 0.75s;
}

.testimonies-btn {
  background-color: var(--light-background-colour1);
  color: var(--black-colour) !important;
}

.testimonies-btn:active i, .testimonies-btn:link i, .testimonies-btn:visited i {
  color: var(--orange-colour);
}

.testimonies-btn:hover i {
  transform: scale(1.5, 1.5);
  transition-duration: 0.75s;
}

/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* Responsive styles */
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* Small screens - Cell phones */
@media (max-width: 575px) {
  div.columns {
    margin: 10px 0;
  }

  #nav-title {
    visibility: hidden;
  }

  .carousel-caption {
    font-size: 0.8rem;
  }
}

