/**

* Template Name: Sailor - v4.7.0

* Template URL: https://bootstrapmade.com/sailor-free-bootstrap-theme/

* Author: BootstrapMade.com

* License: https://bootstrapmade.com/license/

*/



/*--------------------------------------------------------------

# General

--------------------------------------------------------------*/

body {

  font-family: "Open Sans", sans-serif;

  color: #444444;



}



a {

  text-decoration: none;

  color: #4f6b80;

}



a:hover {

  color: #7191a8;

  text-decoration: none;

}



h1, h2, h3, h4, h5, h6 {

  font-family: "Raleway", sans-serif;

}

h4 {color: #607d70;}

h3 {color: #8EA512; font-size: 40px!important;line-height: 45px!important; text-align: center}

.news h3 {color: #af3944; font-size: 28px!important;line-height: 35px!important; text-align: center}

.news {text-align: center}

.center {text-align: center}

a.big {font-weight: bold; color: blue;}

.arrow {

  border: solid ;

  border-width: 0 3px 3px 0;

  display: inline-block;

  padding: 3px;

}



.right {

  transform: rotate(-45deg);

  -webkit-transform: rotate(-45deg);

}



.left {

  transform: rotate(135deg);

  -webkit-transform: rotate(135deg);

}



.up {

  transform: rotate(-135deg);

  -webkit-transform: rotate(-135deg);

}



.down {

  transform: rotate(45deg);

  -webkit-transform: rotate(45deg);}

  

 .pt50 {padding-top: 100px}

 .pt50 h4 {padding-top: 30px; padding-bottom: 20px; color: #556270; text-align: center}

 .pt50 h4 small {color:#444444}

 .pt10 {padding-top: 10px}

 .pt10 h4 {padding-top: 30px; padding-bottom: 20px; color: #556270; text-align: center}

 .pt10 h4 small {color:#444444}

  

.box {padding-bottom: 50px}



.btn-outline-secondary {

    color: #33a7c8;

    border-color: #a8dae9;

	font-size: 12px

}







.btn-outline-secondary:hover, .btn-outline-secondary:active, .btn-outline-secondary:visited {

    background-color: #cceaf2!important;color: #33a7c8; border-color: #a8dae9

}

.table-striped>tr:nth-child(odd){

   background-color:red;

}



/*--------------------------------------------------------------

# Back to top button

--------------------------------------------------------------*/

.back-to-top {

  position: fixed;

  visibility: hidden;

  opacity: 0;

  right: 15px;

  bottom: 15px;

  z-index: 996;

  background: #d9232d;

  width: 40px;

  height: 40px;

  border-radius: 4px;

  transition: all 0.4s;

}

.back-to-top i {

  font-size: 28px;

  color: #fff;

  line-height: 0;

}

.back-to-top:hover {

  background: #e1444d;

  color: #fff;

}

.back-to-top.active {

  visibility: visible;

  opacity: 1;

}



/*--------------------------------------------------------------

# Header

--------------------------------------------------------------*/

#header {

  background: white;

  transition: all 0.5s;

  z-index: 997;

  padding: 10px 0;

  border-bottom: #bcc5cd solid 1px;

}

#header.header-scrolled {

  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);

  padding: 12px 0;

}

#header.header-inner-pages {

  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);

}

#header .logo {

  font-size: 28px;

  margin: 0;

  padding: 0;

  line-height: 1;

  font-weight: 700;

  text-transform: uppercase;

}

#header .logo a {

  color: #556270;

}

#header .logo img {

  max-height: 120px;

}



/*--------------------------------------------------------------

# Navigation Menu

--------------------------------------------------------------*/

/**

* Desktop Navigation 

*/

.navbar {

  padding: 0;

}

.navbar ul {

  margin: 0;

  padding: 0;

  display: flex;

  list-style: none;

  align-items: center;

}

.navbar li {

  position: relative;

}

.navbar a, .navbar a:focus {

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding: 10px 0 10px 20px;

  font-family: 'Roboto Condensed', sans-serif;

  font-size: 18px;

  font-weight: 500;

  color: #556270;

  white-space: nowrap;

  transition: 0.3s;

  letter-spacing: -0.5px;

}

.navbar a i, .navbar a:focus i {

  font-size: 10px!important;

  line-height: 0;

  margin-left: 7px;

  

  font-weight: 300

}

.navbar a:hover, .navbar .active, .navbar .active:focus, .navbar li:hover > a {

  color: #aa8f7d;

}

.navbar .getstarted, .navbar .getstarted:focus {

  font-weight: 800;

color:#cccccc

}

.navbar .getstarted:hover, .navbar .getstarted:focus:hover {

  color: #fff;

  background: #e1444d;

}

.navbar .dropdown ul {

  display: block;

  position: absolute;

  right: 14px;

  top: calc(100% + 30px);

  margin: 0;

  padding: 10px 0;

  z-index: 99;

  opacity: 0;

  visibility: hidden;

  background: #fff;

  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);

  transition: 0.3s;

}

.navbar .dropdown ul li {

  min-width: 300px;

  border-bottom: 1px solid #cccccc

}

.navbar .dropdown ul a {

  padding: 10px 20px;

  font-size: 17px;

  text-transform: none;

  font-weight: 400;

}

.navbar .dropdown ul a i {

  font-size: 12px;

}

.navbar .dropdown ul a:hover, .navbar .dropdown ul .active:hover, .navbar .dropdown ul li:hover > a {

  color: #aa8f7d;

}

.navbar .dropdown:hover > ul {

  opacity: 1;

  top: 100%;

  visibility: visible;

}

.navbar .dropdown .dropdown ul {

  top: 0;

  left: calc(100% - 30px);

  visibility: hidden;

}

.navbar .dropdown .dropdown:hover > ul {

  opacity: 1;

  top: 0;

  left: 100%;

  visibility: visible;

}

.bolder {

  font-weight: bold!important;

color:#7E8077!important

}

@media (max-width: 1366px) {

  .navbar .dropdown .dropdown ul {

    left: -90%;

  }

  .navbar .dropdown .dropdown:hover > ul {

    left: -100%;

  }

}



/**

* Mobile Navigation 

*/

.mobile-nav-toggle {

  color: #556270;

  font-size: 28px;

  cursor: pointer;

  display: none;

  line-height: 0;

  transition: 0.5s;

}

.mobile-nav-toggle.bi-x {

  color: #fff;

}



@media (max-width: 991px) {

  .mobile-nav-toggle {

    display: block;

  }



  .navbar ul {

    display: none;

  }

}

.navbar-mobile {

  position: fixed;

  overflow: hidden;

  top: 0;

  right: 0;

  left: 0;

  bottom: 0;

  background: rgba(63, 73, 83, 0.9);

  transition: 0.3s;

  z-index: 999;

}

.navbar-mobile .mobile-nav-toggle {

  position: absolute;

  top: 15px;

  right: 15px;

}

.navbar-mobile ul {

  display: block;

  position: absolute;

  top: 55px;

  right: 15px;

  bottom: 15px;

  left: 15px;

  padding: 10px 0;

  background-color: #fff;

  overflow-y: auto;

  transition: 0.3s;

}

.navbar-mobile a, .navbar-mobile a:focus {

  padding: 10px 20px;

  font-size: 15px;

  color: #556270;

  border-bottom: 1px solid #bcc5cd

}

.navbar-mobile a:hover, .navbar-mobile .active, .navbar-mobile li:hover > a {

  color: #d9232d;

}

.navbar-mobile .getstarted, .navbar-mobile .getstarted:focus {

  margin: 15px;

}

.navbar-mobile .dropdown ul {

  position: static;

  display: none;

  margin: 10px 20px;

  padding: 10px 0;

  z-index: 99;

  opacity: 1;

  visibility: visible;

  background: #fff;

  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);

}

.navbar-mobile .dropdown ul li {

  min-width: 200px;

}

.navbar-mobile .dropdown ul a {

  padding: 10px 20px;

}

.navbar-mobile .dropdown ul a i {

  font-size: 12px;

}

.navbar-mobile .dropdown ul a:hover, .navbar-mobile .dropdown ul .active:hover, .navbar-mobile .dropdown ul li:hover > a {

  color: #d9232d;

}

.navbar-mobile .dropdown > .dropdown-active {

  display: block;

}



/*--------------------------------------------------------------

# Hero Section

--------------------------------------------------------------*/

#hero {

  width: 100%;

  height: 750px;

  background-color: rgba(63, 73, 83, 0.8);

  overflow: hidden;

  position: relative;

}

#hero .carousel, #hero .carousel-inner, #hero .carousel-item, #hero .carousel-item::before {

  position: absolute;

  top: 0;

  right: 0;

  left: 0;

  bottom: 0;

}

#hero .carousel-item {

  background-size: cover;

  background-position: bottom center;

  background-repeat: no-repeat;

}

#hero .carousel-item::before {

  content: "";

  background-color: rgba(30, 35, 40, 0.1);

}

#hero .carousel-container {

  display: flex;

  justify-content: center;

  align-items: center;

  position: absolute;

  bottom: 0;

  top: 70px;

  left: 50px;

  right: 50px;

}

#hero .container {

  text-align: center;

}



@media (max-width: 992px) {

  #hero {

    height: 100vh;

  }

  #hero .carousel-container {

    top: 8px;

  }

}

@media (max-width: 768px) {

  #hero h2 {

    font-size: 28px;

	 }

  #hero {

    height: 500px;

  }

}

@media (min-width: 1024px) {

  #hero .carousel-control-prev, #hero .carousel-control-next {

    width: 5%;

  }

}

@media (max-height: 500px) {

  #hero {

    height: 120vh;

  }

}



/*--------------------------------------------------------------

# Sections General

--------------------------------------------------------------*/

section {

  padding: 40px 0;

  overflow: hidden;

}

section#about{ padding: 40px 0 1px 0;}



.section-bg, .services .icon-box {

  background-color: #f8f9fa;

}



.section-title {

  padding-bottom: 40px;

}

.section-title h2 {

  font-size: 14px;

  font-weight: 500;

  padding: 0;

  line-height: 1px;

  margin: 0 0 5px 0;

  letter-spacing: 2px;

  text-transform: uppercase;

  color: #aaaaaa;

  font-family: "Poppins", sans-serif;

}

.section-title h2::after {

  content: "";

  width: 120px;

  height: 1px;

  display: inline-block;

  background: #e6636a;

  margin: 4px 10px;

}

.section-title p {

  margin: 0;

  margin: 0;

  font-size: 36px;

  font-weight: 700;

  text-transform: uppercase;

  font-family: "Poppins", sans-serif;

  color: #556270;

}

.news {padding-top: 50px}



/*--------------------------------------------------------------

# Breadcrumbs

--------------------------------------------------------------*/

.breadcrumbs {

  padding: 60px 0;

  background: #f8f9fa url(../img/bg-page.jpg) no-repeat center top;

  min-height: 125px;

  margin-top: 85px;

  background-size: cover

}

.breadcrumbs h3 {

  padding-top: 50px;font-size: 32px;

  font-weight: 500;

  margin: 0;

color: #ffffff

}

.breadcrumbs h3 a{

  padding-top: 60px;font-size: 32px;

  font-weight: 500;

  margin: 0;

text-shadow: 1px 1px 4px #ffffff;

}



@media (max-width: 992px) {

  .breadcrumbs {

    margin-top: 58px;

  }

  .breadcrumbs .d-flex {

    display: block !important;

  }

  .breadcrumbs h2 {

    margin-bottom: 10px;

  }

  .breadcrumbs ol {

    display: block;

  }

  .breadcrumbs ol li {

    display: inline-block;

  }

}



/*--------------------------------------------------------------

# Welcome

--------------------------------------------------------------*/

.welcome {

  padding: 60px 0;

  background: #f8f9fa url(../img/welcome.jpg) no-repeat center center;

  min-height: 340px;

  margin-top: 85px;

  background-size: cover

}

.welcome h3 {

  padding-top: 50px;font-size: 32px;

  font-weight: 500;

  margin: 0;

color: #ffffff

}

.welcome h3 a{

  padding-top: 60px;font-size: 32px;

  font-weight: 500;

  margin: 0;

text-shadow: 1px 1px 4px #ffffff;

}



@media (max-width: 992px) {

  .welcome {

    margin-top: 58px;

  }

  .welcome .d-flex {

    display: block !important;

  }

  .welcome h2 {

    margin-bottom: 10px;

  }

  .welcome ol {

    display: block;

  }

  .welcome ol li {

    display: inline-block;

  }

}



/*--------------------------------------------------------------

# About

--------------------------------------------------------------*/

.pages .container ul li {

  padding: 5px 0 5px 0;

  font-size: 18px

}



.pages {min-height: 50vh;

}



.about .content h2 {

  font-weight: 700;

  font-size: 48px;

  line-height: 60px;

  margin-bottom: 20px;

  text-transform: uppercase;

}

.about .content h3 {

  font-weight: 500;

  line-height: 32px;

  font-size: 24px;

}

.about .content ul {

  list-style: none;

  padding: 0;

}

.about .content ul li {

  padding: 10px 0 0 28px;

  position: relative;

}

.about .content ul i {

  left: 0;

  top: 7px;

  position: absolute;

  font-size: 20px;

  color: #d9232d;

}

.about .content p:last-child {

  margin-bottom: 0;

}





/*--------------------------------------------------------------

# Our Team

--------------------------------------------------------------*/

.team .member {

  position: relative;

  box-shadow: 0px 2px 15px rgba(85, 98, 112, 0.08);

  padding: 30px;

  border-radius: 4px;

  background: white;

}

.team .member .pic {

  overflow: hidden;

  width: 140px;

  border-radius: 4px;

}

.team .member .pic img {

  transition: ease-in-out 0.3s;

}

.team .member:hover img {

  transform: scale(1.1);

}

.team .member .member-info {

  padding-left: 30px;

}

.team .member h4 {

  font-weight: 700;

  margin-bottom: 5px;

  font-size: 16px;

  color: #556270;

}

.team .member span {

  display: block;

  font-size: 22px;

  padding-bottom: 10px;

  position: relative;

  font-weight: 500;

}

.team .member span::after {

  content: "";

  position: absolute;

  display: block;

  width: 50px;

  height: 1px;

  background: #dee2e6;

  bottom: 0;

  left: 0;

}

.team .member p {

  margin: 10px 0 0 0;

  font-size: 16px;

}

.team .member .social {

  margin-top: 12px;

  display: flex;

  align-items: center;

  justify-content: flex-start;

}

.team .member .social a {

  transition: ease-in-out 0.3s;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 4px;

  width: 32px;

  height: 32px;

  background: #8795a4;

}

.team .member .social a i {

  color: #fff;

  font-size: 16px;

  margin: 0 2px;

}

.team .member .social a:hover {

  background: #d9232d;

}

.team .member .social a + a {

  margin-left: 8px;

}





@-webkit-keyframes animate-loading {

  0% {

    transform: rotate(0deg);

  }

  100% {

    transform: rotate(360deg);

  }

}

@keyframes animate-loading {

  0% {

    transform: rotate(0deg);

  }

  100% {

    transform: rotate(360deg);

  }

}





/*--------------------------------------------------------------

# Footer

--------------------------------------------------------------*/

#footer {

  background: #898A82;

  padding: 60px 0 60px 0;

  color: #fff;

  font-size: 14px;





}



#footer .credits {

  padding-top: 10px;

  text-align: center;

  font-size: 13px;

  color: rgba(255, 255, 255, 0.6);

}

#footer .credits a {

  color: rgba(255, 255, 255, 0.6);

  transition: 0.3s;

  font-weight: 600;

}

#footer .credits a:hover {

  color: white;

}