@import url('https://fonts.googleapis.com/css2?family=Lato:wght@700&display=swap');




@import url('https://fonts.googleapis.com/css2?family=Lato&display=swap');


body{
  font-family: 'Lato', sans-serif;
   overflow-x: hidden;
   color: #505962;
}

.offset::before
{ 
  display: block;
  content: " ";
  height: 4rem;
  margin-top: -4rem;
}
/* navigation */
.navbar{

text-transform: uppercase;
font-weight: 700;
font-size: 14px;
letter-spacing: 1px;
background: rgba(0,0,0,0.6)!important;

}

.navbar-brand img{
  height:24px;
}

.navbar-nav  li
{
padding-right: .7rem;
}
.navbar-nav  li a{
  font-weight: 100;
  text-transform: capitalize;
  font-size: 14px;
}
.navbar-dark .navbar-nav .nav-link  {
     color: white;
     padding: 0.8rem;
}


.navbar-dark .navbar-nav .nav-link.active,
.navbar-dark .navbar-nav .nav-link:hover{

color: #1ebba3;

}


/* Landing page */

.home-inner
{
  background-image: url(img/computers.png);
}

.caption
{
  width: 100%;
  max-width: 100%;
  position: absolute;
  top: 38%;
  z-index: 1;
  color: white;
  text-transform: uppercase;
}
.caption h1{
  font-size: 2.8rem;
  font-weight: 700;
  letter-spacing: 0.3rem;
  text-shadow: .1rem .1rem .8rem black;
  padding-bottom: 1rem;
}

.caption h3{
  font-size: 1.7rem;

  text-shadow: .1rem .1rem .5rem black;
  padding-bottom: 1.6rem;
}

.btn-lg
{
   border-width: medium;
   font-size:1.1rem;
   padding: .6rem 1.3rem;
  }

/* Start course CSS */

.narrow{
  width: 75%;
  margin: 1.75rem auto;
}
.narrow h1
{
  font-size: 1.7rem;
  padding-bottom: 1rem;
  text-transform: uppercase;
  letter-spacing: .1rem;
}
.btn-secondary
{
  text-transform: uppercase;
  border-radius: 0;
  font-size: .9rem;
  padding: .6rem 1.2rem;
  color: white;
  background: #1ebba3;
  border-color: #1ebba3;
 
  
}
.btn-secondary:hover
{
 
  background: #3c4140;
  border-color: #3c4140;
  
}
/* End course CSS */




/* Start Feature CSS */

.jumbotron
{
  margin-bottom: 0;
 padding: 2rem 0 3.5rem;
 border-radius: 0;
}
h3.heading
{  
   font-size: 1.9rem;
   font-weight: 700;
   text-transform: uppercase;
   margin-bottom: 1.9rem;
}
 
.heading-underline
{
 width: 3rem;
 height: .2rem;
 background-color: #1ebba3;
 margin: 0 auto 2rem;
}
/* End Feature CSS */



.features .svg-inline--fa 
{
  color: #1ebba3;
}
.features h3{
  font-size: 1.3rem;
  text-transform: uppercase;
}


/* <!-- Strat CSS Resources --> */
.fixed{
  background-image: url(img/apple.png);
  z-index: -1;
  
  
}
.dark{
  background-color: rgba(0,0,0,.75);
  padding: 7rem 2rem;
}

.fixed-background h3{
    font-size: 2rem;
    margin-bottom: 2rem;
    color: white;
}

.fixed-background p{
    font-size: 15px;
    margin-top: 1rem;
    color: white;
}

/* <!-- End CSS Resources --> */


/* <!-- Start  CSS Clents --> */

.clients img{
  width: 100%;
  border-radius: 50%;
}

blockquote svg.svg-inline--fa 
{
  color: #1ebba3;
  margin: 1 rem;
}


.client-hr
{
  border-top: .1rem solid #1ebba3;
  width: 100%;
  
}

/* <!-- End CSS Clents --> */


/* <!-- Start CSS Footer --> */

footer{
  background-color: #40474e;
  color:white;
  padding: 2rem 0;
  margin-top: 1rem;
}

footer img{
  height: 3rem;
  margin: 1.5rem  0;
}

footer svg.svg-inline--fa 
{
  font-size: 1.6rem;
  color:white;
  margin: 1.2rem .5rem 0 0;
}

footer svg.svg-inline--fa:hover
{
 
  color: #1ebba3!important;
}

hr.socket
{
  width: 100%;
  border-top: .2rem solid #505962;
}
/* <!-- Start CSS Footer --> */

/* Rseponisve part */


 



  /* landing page caption part */
  @media (max-width: 767px) { 


    .caption h1{
      font-size: 2.3rem;
     letter-spacing: .15rem;
      padding-bottom: .5rem;
    }
    
    .caption h3{
      font-size: 1.2rem;
      padding-bottom: 1.2rem;
    }
    
    .btn-lg
    {
       border-width: medium;
       font-size:.8rem;
       padding: .3rem 2rem;
      }
  
  
      .narrow h1 {
             font-size: .9rem;
             letter-spacing: 1px;
             
      }
      .narrow p  {
        font-size:.7rem ;
      }
      

      .clients img {
        display: block;
        max-width: 50%;
        margin: 0 auto;
      }

  }
  

 













/*============= COURSE SECTION =============*/

/* .narrow {
  width: 75%;
  margin: 1.5rem auto;
  padding-top: 2rem;
}
.narrow h1 {
    font-size: 2.4rem;
  }
.btn-secondary {
  border-width: medium;
  border-radius: 0;
  padding: .6rem 1.2rem;
  font-size: 1.2rem;
  text-transform: uppercase;
  margin: 1rem;
  border-color: #1EBBA3;
  background-color: #1EBBA3;
  color: white;
}
.btn-secondary:hover,
.btn-secondary:focus {
  border-color: #189582;
  background-color: #189582;
  color: white;
} */


/*============ BOOTSTRAP BREAK POINTS:

Extra small (xs) devices (portrait phones, less than 576px)
No media query since this is the default in Bootstrap

Small (sm) devices (landscape phones, 576px and up)
@media (min-width: 576px) { ... }

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

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

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

=============*/