
::selection { background: #ff5a56; color: #fff; text-shadow: none; }

/* Fonts */
body {
  font-family: 'Roboto', sans-serif;
  font-weight: 300;
  color: #888;
}

h1, h2 { font-weight: 100 !important; color: #555; }
h3 { font-weight: 300 !important; color: #555; }

/* Links */
a {
  color: #ff5a56;
  text-decoration: none;
  transition: all .15s ease-in-out;
}
a:hover,
a:focus { color: #ff312c; }

/* Buttons - restyling Bootstrap buttons with only simple CSS, no CSS variables (custom properties) */
.btn.azm-btn-primary {
  background-color: #ff5a56;
  border-color: #ff5a56;
  font-weight: 300;
}

.btn.azm-btn-primary:hover { background-color: #ff312c; border-color: #ff312c; box-shadow: none; }
.btn.azm-btn-primary:active { background-color: #ff312c; border-color: #ff312c; box-shadow: none; }
.btn.azm-btn-primary:focus { background-color: #ff312c; border-color: #ff312c; color: #fff; box-shadow: none; }
.btn.azm-btn-primary:active:focus { background-color: #ff312c; border-color: #ff312c; color: #fff; box-shadow: none; }

.btn.azm-btn-primary:focus-visible {
  background-color: #ff312c;
  border-color: #ff312c;
  box-shadow: none;
}

.btn.azm-btn-light {
  background-color: #fff;
  border-color: #fff;
  font-weight: 300;
  color: #555;
}

.btn.azm-btn-light:focus {
  background-color: #ddd;
  border-color: #ddd;
  color: #555;
  box-shadow: none;
}

.btn.azm-btn-light:hover,
.btn.azm-btn-light:active,
.btn.azm-btn-light:active:focus,
.btn.azm-btn-light:focus-visible {
  background-color: #ddd;
  border-color: #ddd;
  color: #555;
  box-shadow: none;
}

.btn-close:focus { box-shadow: 0 0 0 0.25rem rgba(0, 0, 0, .2); }


/* Custom utility classes */

.azm-spacer {}

.azm-divider { width: 200px; border-bottom: 3px dashed #ddd; }

.azm-color-444 { color: #444; }
.azm-color-555 { color: #555; }
.azm-color-666 { color: #666; }
.azm-color-888 { color: #888; }
.azm-color-ff5a56 { color: #ff5a56; }
.azm-color-ccc { color: #ccc; }
.azm-grey { color: #aaa; }

.azm-font-size-1-15 { font-size: 1.15rem; }

.azm-line-height-2-5 { line-height: 2.5rem; }

.azm-border-dashed { border-bottom: 1px dashed; }
.azm-border-dotted { border-bottom: 1px dotted; }

.azm-grey-background { background-color: #f8f8f8; }
.azm-background-3d3d3d { background-color: #3d3d3d; }
.azm-background-444 { background-color: #444; }
.azm-background-ff5a56 { background-color: #ff5a56; }

.azm-list-style-none { list-style: none; }

.divider {
  width: 200px;
  border-bottom: 1px dotted #aaa;
}

.divider-white {
  border-color: #fff;
  border-color: rgba(255, 255, 255, 0.8);
}


/* Navbar */
.navbar.bg-dark.azm-navbar {
  background-color: #3d3d3d !important;
  transition: all .6s ease-in-out;
}

.navbar.bg-dark.azm-navbar.azm-navbar-transparency { background-color: transparent !important; }

.navbar.bg-dark.azm-navbar .dropdown-menu { background-color: #3d3d3d; }

.azm-navbar .navbar-brand {
	
	height: 41px;
	width: 99px;
	background: url(assets/logo.png) left center no-repeat;
	text-indent: -99999px;
}

.azm-navbar .navbar-nav .nav-link {
  padding-right: 0.75rem;
  padding-left: 0.75rem;
}

.azm-navbar .dropdown-menu { box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); }


/* Header */
#header {
  background-image: url(assets/bg-1.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}


/* Main Features */
#features .icon {
  width: 80px;
  height: 80px;
  border: 1px solid #ff5a56;
  font-size: 40px;
  color: #ff5a56;
  line-height: 78px;
  text-align: center;
  border-radius: 50%;
  transition: all .3s ease-in-out;
}

#features .icon:hover { background: #ff5a56; color: #fff; }


/* Video */
#video a.azm-border-dotted:hover,
#video a.azm-border-dotted:focus { border: 0; }


/* More features */
.more-features-icon {
  width: 60px;
  height: 60px;
  background: #ff5a56;
  font-size: 28px;
  color: #fff;
  line-height: 60px;
  text-align: center;
  border-radius: 50%;
}


/* Great support */
.great-support-icon {
  width: 60px;
  height: 60px;
  background: #ff5a56;
  font-size: 28px;
  color: #fff;
  line-height: 60px;
  text-align: center;
  border-radius: 50%;
}


/* How it works */
#how-it-works {
  background-image: url(assets/bg-2.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

.how-it-works-number {
  font-size: 3.5rem;
  color: #fff;
}

.how-it-works-number span { border-bottom: 5px solid #ff5a56; }


/* Call to action */
#call-to-action {
  background-image: url(assets/bg-1.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}


/* Prices */
#prices .table th {
  border-bottom: 1px dashed #eee;
}

#prices .table { box-shadow: 0 0 25px 0 rgba(0, 0, 0, 0.1); }

.price-number strong { font-weight: 500; }


/* About Us */
#about-us .about-us-photo { width: 160px; }

#about-us .about-us-role {
    bottom: 10px;
    right: -10px;
    font-size: 0.9rem;
}

.about-us-social a:hover,
.about-us-social a:focus { color: #ff5a56; outline: 0; }


/* Testimonials */
#testimonials {
  background-image: url(assets/bg-2.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

#testimonials .tab-pane a {
  color: #fff;
  border-bottom: 1px dotted #fff;
  border-color: rgba(255, 255, 255, .75);
}

#testimonials .tab-pane a:hover,
#testimonials .tab-pane a:focus { border: 0; }

#testimonials .nav-pills .nav-item a { opacity: 0.6; width: 80px; }

#testimonials .nav-pills .nav-item a.active { opacity: 1; }

#testimonials .nav-pills .nav-item a:hover,
#testimonials .nav-pills .nav-item a:focus { opacity: 1; }

#testimonials .nav-pills .nav-item a img { transition: all .15s ease-in-out; }

#testimonials .nav-pills .nav-item a.active img,
#testimonials .nav-pills .nav-item a:hover img,
#testimonials .nav-pills .nav-item a:focus img {
  box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.3) !important;
}


/* Contact */
#contact {
  background-image: url(assets/bg-3.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

#contact form {
  background: #fff;
  box-shadow: 0 0 25px 0 rgba(0, 0, 0, 0.1);
}

#contact form .form-control,
#contact form .form-control:focus {
  background-color: #fff;
  border: 1px solid #ddd;
  color: #666;
  font-weight: 300;
}

#contact form .form-control:focus {
  border-color: #ff5a56;
  box-shadow: none;
}

#contact form .form-control::placeholder { color: #aaa; font-style: italic; font-weight: 300; }

#contact form .invalid-feedback { width: 200px; top: 0; right: 0; color: #ff5a56; }


/* Pre Footer */
.pre-footer-contact-info i { color: #888; vertical-align: middle; }

.pre-footer-social a { color: #888; }

.pre-footer-social a:hover,
.pre-footer-social a:focus { outline: 0; color: #ff5a56; }


/* Footer */
footer a.azm-border-dotted:hover,
footer a.azm-border-dotted:focus { outline: 0; color: #fff; }

.to-top a:hover,
.to-top a:focus { outline: 0; color: #fff; }



/* Media queries */

@media (max-width: 991px) {
	
  .navbar.bg-dark.azm-navbar.azm-navbar-transparency { background-color: #3d3d3d !important; }
  
}

@media (min-width: 992px) and (max-width: 1199px) {

	#features .icon { width: 60px; height: 60px; font-size: 28px; line-height: 58px; }
	
	.how-it-works-number { font-size: 3rem; }
		
}

@media (min-width: 768px) and (max-width: 991px) {

	#features .icon { width: 50px; height: 50px; font-size: 20px; line-height: 48px; }
	
	.more-features-icon { width: 50px; height: 50px; font-size: 20px; line-height: 50px; }
	
	.how-it-works-number { font-size: 2rem; }

}

@media (max-width: 400px) {
	
	#contact form .invalid-feedback { width: 140px; }

}

/* Retina-ize images/icons */
@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2),
only screen and (                min-resolution: 192dpi),
only screen and (                min-resolution: 2dppx) {
	
  /* logo */
  .azm-navbar .navbar-brand {
    background-image: url(assets/logo.png) !important; background-repeat: no-repeat !important; background-size: 99px 41px !important;
  }
	
}
