body{
    margin:0;
    padding:0;
}
#title{
    background-color: #2f4858;
  }
  .navbar{

    padding:10px;
  }
  .navbar-brand{
    font-family: "Ubuntu";
    font-size: 1.8rem;
    font-weight: 400;
    padding-left:1.5rem;
  }
  .nav-item{
    padding:0 18px;
  }
  .nav-link{
    font-size:1.2rem;
    font-weight:400;
  }
  .media-wrapper{
    text-align: center;
  }
  .icons{
    color:#FFBD69;
    padding-right: 1rem;
  }


#welcome{
    height: 95vh;  /*95% of viewport height*/
    background-image: linear-gradient(to right bottom,rgba(53, 80, 112,0.8),rgba(234, 172, 139,0.8)), url(../images/bg2.png);
    background-size: cover;
    /*background-position: top;*/
    position: relative;
    border: solid #fff 10px;
    /*margin: 2%;*/
    padding: 3%;
    /*border-style: outset;*/
}


.text-box{
    position: absolute;
    top: 60%;
    left: 50%;
    transform: translate(-50%,-50%);
    text-align: center;

}

.heading-primary-4{
   font-family: "Lato";
   font-weight: 400;
    color: #fff;
    text-transform: uppercase;
    backface-visibility: hidden;
    margin-bottom: 5%;

}

.heading-primary-main-4{
  font-family: "Lato";
    display: block;
    font-weight: 400;
    font-size: 4rem;
    /*font-size: 60px;*/
    letter-spacing: 1.7rem;
    animation-name: moveInLeft;
    animation-duration: 2s;
    animation-timing-function: ease-out;

    animation-delay: .5s;
    margin-bottom: 4%;
}

.heading-primary-sub-4{
  display: block;
  font-size: 2.5rem;
  font-weight: 700;
  letter-spacing: 1.0875rem;
  animation-name: moveInRight;
   animation-delay: .5s;
  animation-duration: 2s;
  animation-timing-function: ease-out;
  margin-bottom: 7%;
}

.heading-primary-sub-2-4{
  display: block;
  font-family: 'Dancing Script', cursive;
  font-size: 2rem;
  font-weight: 700;
  letter-spacing: .25rem;
  color: #fff;
  animation-name: moveInBottom;
  animation-delay: .5s;
  animation-duration: 2s;
  animation-timing-function: ease-out;
  margin-bottom: 25%;
}


@keyframes moveInLeft{
     0%{
     opacity: 0;
     transform: translateX(-6.25rem) rotate(0deg);

       }



60%{
    transform: rotate(180deg);
}


   80%{

       transform: translateX(0.625rem)  ;

      }

   100%{
      opacity: 1;
      transform: translate(0);

       }



}


@keyframes moveInRight{
     0%{
     opacity: 0;
     transform: translateX(6.25rem);

       }

   80%{

       transform: translateX(-.625rem);

      }

   100%{
      opacity: 1;
      transform: translate(0);

       }



}

@keyframes moveInBottom{


0%{
     opacity: 0;
     transform: translateY(1.875rem); /*Move it down*/

       }


   100%{
      opacity: 1;
      transform: translate(0);

       }


}

/*.resources{
    height:69vh;
    padding : 4rem;
    background-image: linear-gradient(to right bottom,#b56576,#eaac8b), url(../images/bg2.png);

}
.heading-primary-sub-2{
    color:white;
    font-size: 3rem;
}*/
.section-tour{
    background-color: #f7f7f7;
    height:187vh;
    clip-path: polygon(0 0,100% 0, 0 104 ,0 100%);
    padding:-4.5rem;


}
.u-center-text{
    text-align: center;
}
.u-margin-bottom-8{
    margin-bottom:4rem;
}
.heading-secondary:hover{
    transform:skewY(2deg) skewX(15deg) scale(1.1);
    text-shadow: .5rem 1rem 2rem rgba(0, 0, 0, 0.3);
}
.heading-secondary{
    text-transform: uppercase;
    font-size:3.5rem;
    font-weight:700;
display:inline-block;
    background-image:linear-gradient(to right,#6d597a,#6d597a);
    -webkit-background-clip:text;
    letter-spacing: 2px;
    transition: all 0.2s;
    color:transparent;
    top:5px;
    margin: 0 auto;
}
.row-2
{
    max-width:114rem;
    margin:0 auto;
    background-color: #f7f7f7;
    margin-left:9rem;


}



[class^="colu-"]
   { float:left;

}
.colu-1-of-3
{
    width:calc((100% - 12rem)/3);
    margin-right:3rem;
    margin-bottom:-18rem;

}
.card--1{
    perspective: 150rem;
    -moz-perspective: 150rem;
    position: relative;
    height:53rem;
}
.card__side{
    height:33rem;
    transition: all 0.9s ease;
    position: absolute;
     top:0;
    left:0;
    width:100%;
    backface-visibility:hidden;
    border-radius: 3px;
    overflow: hidden;
    box-shadow: 0 1.5rem 4rem rgba(0,0,0,.15);
}
.card__side--back{

    transform: rotateY(180deg);
}
.card__side--back-1{
    background-image:linear-gradient(to right bottom , #b56576,#eaac8b);
}
.card--1:hover .card__side--front{
    transform: rotateY(-180deg);
}
.card--1:hover .card__side--back{
    transform: rotateY(0);
}
.card__picture{
    background-size:cover;
    height:23rem;
    background-blend-mode: screen;
    -webkit-clip-path: polygon(0 0,100% 0,100% 130%,0 100%);
    clip-path: polygon(0 0,100% 0,100% 130%,0 100%);
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}
.card__picture-1{
    background-image:linear-gradient(to right bottom , #b56576,#eaac8b),url(../images/udemy.jpg);

}
.card__heading{
    font-size:2.8rem;
    font-weight:300;
    text-align: right;
    text-transform: uppercase;
    position: absolute;
    color:white;
    top:12rem;
    right:2rem;
    width:75%;
}
.card__heading-span{
    padding:1rem 1.5rem;
    -webkit-box-decoration-break:clone;
    box-decoration-break:clone;
}
.card__details
{
    padding:1.5rem;
}

.card-cta{
    position:absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
    width:90%;
    text-align: center;
}
.card__price-box{
    padding:2rem;
    color:white;
    margin-bottom:-0.5rem;
  }
  .btn:link,
.btn:visited{
    text-transform: uppercase;
    text-decoration: none;
    padding:0.5rem 2rem;
    display:inline-block;
    border-radius: 10rem;
    position:relative;
    animation-name: Moveinbottom;
    animation-duration: 3s;
    animation-delay:0.75s;
    animation-fill-mode: backwards;
    font-size:1.6rem;
}
.btn-white{
    background-color:white;
    color:#777
}
.btn:hover{
    transform: translateY(-.3rem);
    box-shadow: 0 0.5rem 1rem rgba(0,0,0,.2);
}
.btn-active{
    transform:translateY(-.1rem);
    box-shadow: 0 .25rem 0.5rem rgba(0,0,0,.2);
}
.btn::after{
    content:"";
    display:inline-block;
    height:100%;
    width:100%;
    border-radius:10rem;
    position:absolute;
    top:0;
    left:0;
    z-index:-1;
    transition: all 0.4s;
}
.btn-white::after{
    background-color:white;
}
.btn:hover::after{
    transform:scaleX(1.4) scaleY(1.6);
    opacity: 0;

}
.card__picture-2{
    background-image: linear-gradient(to right bottom ,rgba(20, 33, 61,0.8),rgba(252, 163, 17,0.8)),url(../images/codingblocks.jpg);

}
.card__picture-3{
    background-image: linear-gradient(to right bottom , rgba(20, 33, 61,0.8),rgba(252, 163, 17,0.8)),url(../images/pepcoding.jpg);

}
.card__picture-4{
    background-image: linear-gradient(to right bottom , rgba(20, 33, 61,0.8),rgba(252, 163, 17,0.8)),url(../images/coursera.jpg);

}
.card__picture-5{
    background-image: linear-gradient(to right bottom , rgba(20, 33, 61,0.8),rgba(252, 163, 17,0.8)),url(../images/ninja.jpg);

}
.card__picture-6{
    background-image: linear-gradient(to right bottom , rgba(20, 33, 61,0.8),rgba(252, 163, 17,0.8)),url(../images/edx.jpg);

}

.heading-secondary-1
{
    color:white;
    font-size:3.5rem;
}
.row1
{
    max-width:114rem;
    margin:0 auto;
    background-color: #f7f7f7;
    margin-left:5rem;

}
[class^="col1-"]
   { float:left;

}
.col1-1-of-4
{
    width:calc((100%-34rem)/4);
    margin-right:4.5rem;
    margin-bottom:0.5rem;

}
.info1 p{
    font-size:2.5rem;
    color:white;
}
.info1 a{
    color:white;
}
.feature-box__text {
    font-size:1.8rem;
}
.heading-tertiary{
    font-size:1.5rem;
    color:white;
}
.heading-secondary{
    color: #073b4c;

}

.section-3{
    padding: 2rem;
    background-image: linear-gradient(to right bottom,rgba(53, 80, 112,0.8),rgba(234, 172, 139,0.8)), url(../images/bg2.png);
    background-size: cover;
      height:60vh;
    /*margin-top: 70%; */
}
/*footer*/
#footer {
  background-color: #2f4858;
  padding: 6% 10% 5% 10%;
}

.logoname {
  text-decoration: none;
  color: #ffffff;
}

.footerlogo {
  text-align: center;
  font-family: "Ubuntu";
  font-size: 2.5rem;
  font-weight: 400;
  padding-bottom: 4%;
}

.foo {
  padding: 3% 2% 2% 2%;
  text-align: center;
}

.footer__navigation {
  text-align: center;
}

.footer__list {
  list-style: none;
}

.footer__item {
  display: inline-block;
}

.footer__item {
  margin-right: 1.5rem;
}

.footer__link:link,
.footer_link:visited {
  color: white;
  color: #777;
  text-decoration: none;
  text-transform: uppercase;
  display: inline-block;
  transition: all 0.2s;
}

.footer__link:hover,
.footer__link:active {
  color: #F4A460;
  box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.4);
  transform: rotate(5deg) scale(1.3);
}

.footer__item a {
  color: white;
  font-size: 1.2rem;
}

.footer__copyright {
  color: white;
}
@media screen and (max-width:768px){
  .footer__item {
    display: block;
  }
}
