/* Global */
body {
  font-family: 'Markazi Text', serif;
  color: #000;
}

h1 {
  font-size: 4em;
}

h2 {
  font-size: 3em;
}

h3 {
  font-size: 1.5em;
}

p {
  font-size: 1.3em;
}

.section .container {
  padding: 0 40px;
}

/* Social icons */
.social {
  margin-top: 35px;
}

.social img {
  margin-right: 10px;
  width: 30px;
}

/* Portfolio */
.portfolio-tile {
    position: relative;
    background-color: #fff;
    overflow: hidden;
    border-radius: 0;
}

.portfolio-tile h3 {
    font-size: 2em;
    color: #fff;
}

.portfolio-tile .overlay {
    display: flex;
    width: 100%;
    height: 100%;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
    background-color:rgba(0,0,0,0.1);
    -webkit-transition:all .4s ease-in-out;
    transition:all .4s ease-in-out;
}

.portfolio-tile:hover .overlay {
    background-color:rgba(0,0,0,0.0);
}

.portfolio-tile img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: bottom;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
  }

.portfolio-tile:hover img {
    -moz-transform: scale(1.05);
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
}

/* Contact form */
.container-form {
	max-width: 800px;
	padding-top: 50px;
	padding-bottom: 50px;
}

.container-form h2 {
  color: #fff;
}

label {
  color: #fff;
  font-size: 1.5em;
  font-weight: 700;
}

.form-check-label {
  font-size: 1em;
}

.form-control {
  background: #616161;
  font-size: 1em;
  border: 0;
  border-radius: 0;
  color: #fff;
}

.form-control:focus {
  background-color: #444444;
  color: #fff;
}

.form-control::placeholder {
  color: #BDBDBD;
}

.text-muted {
  font-size: 1em;
  color: #BDBDBD!important;
}

.btn-primary {
  background-color: #E91E63;
  color: #fff;
  font-size: 1.6em;
  border: 0;
  border-radius: 0;
  padding: .275rem 1.75rem;
}

.btn-primary:hover {
  background-color: #d91c5c;
}

/* Scroll arrow */
.scroll-down {
  position: absolute;
  left: 50%;
  bottom: 30px;
  display: block;
  text-align: center;
  font-size: 20px;
  z-index: 100;
  text-decoration: none;
  text-shadow: 0;
  width: 13px;
  height: 13px;
  border-bottom: 2px solid #000;
  border-right: 2px solid #000;
  z-index: 9;
  left: 50%;
  -webkit-transform: translate(-50%, 0%) rotate(45deg);
  -moz-transform: translate(-50%, 0%) rotate(45deg);
  transform: translate(-50%, 0%) rotate(45deg);
  -webkit-animation: fade_move_down 4s ease-in-out infinite;
  -moz-animation:    fade_move_down 4s ease-in-out infinite;
  animation:         fade_move_down 4s ease-in-out infinite;
}

/* Animated scroll arrow animation */
@-webkit-keyframes fade_move_down {
  0%   { -webkit-transform:translate(0,-10px) rotate(45deg); opacity: 0;  }
  50%  { opacity: 1;  }
  100% { -webkit-transform:translate(0,10px) rotate(45deg); opacity: 0; }
}
@-moz-keyframes fade_move_down {
  0%   { -moz-transform:translate(0,-10px) rotate(45deg); opacity: 0;  }
  50%  { opacity: 1;  }
  100% { -moz-transform:translate(0,10px) rotate(45deg); opacity: 0; }
}
@keyframes fade_move_down {
  0%   { transform:translate(0,-10px) rotate(45deg); opacity: 0;  }
  50%  { opacity: 1;  }
  100% { transform:translate(0,10px) rotate(45deg); opacity: 0; }
}

/* Navigation dots */

#fp-nav {
  display: none;
}

#fp-nav ul li .fp-tooltip {
  font-family: 'Markazi Text', serif;
  font-size: 1rem;
  top: -6px;
  right: 20px;
  color: #666;
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) { 
  h1 {
    font-size: 5em;
  }

  h2 {
    font-size: 4em;
  }

  h3 {
    font-size: 2em;
  }

  p {
    font-size: 1.5em;
  }

  .section .container {
    padding: 0 15px;
  }

  .social img {
    margin-right: 10px;
    width: 40px;
  }

  label {
    font-size: 2em;
  }

  .form-control {
    font-size: 1.3em;
  }

  #fp-nav {
    display: block;
  }

	.container-form {
		padding-top: 0;
		padding-bottom: 0;
	}
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {  }

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {  }

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {  }