/* Required height of parents of the Half Page Carousel for proper displaying carousel itself */
html,
body,
.view {
  height: 100%;
  font-family: 'Dosis','Noto Sans SC',sans-serif;
  font-size: 1.2rem;
  font-weight: 400;
  color: #6E60AA;
  position: relative;
}
.btn {
  font-size: 1.2rem;
}
.btn-rounded{
  -webkit-border-radius:10em;
  border-radius:10em;
}
.btn-floating {
  -webkit-box-shadow:0 5px 11px 0 rgba(0,0,0,.18),0 4px 15px 0 rgba(0,0,0,.15)
}
.btn-floating{
    box-shadow:0 5px 11px 0 rgba(0,0,0,.18),0 4px 15px 0 rgba(0,0,0,.15);
    width:47px;
    height:47px;
    position:relative;
    z-index:1;
    overflow:hidden;
    -webkit-transition:all .2s ease-in-out;
    -o-transition:all .2s ease-in-out;
    transition:all .2s ease-in-out;
    margin:10px;
    -webkit-border-radius:50%;
    border-radius:50%;
    padding:0;
    cursor:pointer
}
.btn-floating i{
    font-size:1.25rem;
    line-height:47px;
    width:inherit;
    text-align:center;
    color:#fff
}
.btn-floating:hover{
    -webkit-box-shadow:0 8px 17px 0 rgba(0,0,0,.2),0 6px 20px 0 rgba(0,0,0,.19);
    box-shadow:0 8px 17px 0 rgba(0,0,0,.2),0 6px 20px 0 rgba(0,0,0,.19)
}
.btn-floating:before{
    -webkit-border-radius:0;
    border-radius:0
}
.btn-floating.btn-sm{
    width:36.15px;
    height:36.15px
}
.btn-floating.btn-sm i{
    font-size:.96154rem;
    line-height:36.15px
}
.btn-floating.btn-lg{
    width:61.1px;
    height:61.1px
}
.btn-floating.btn-lg i{
    font-size:1.625rem;
    line-height:61.1px
}
.flex-1 {
    flex : 1;
}
h1, h2, h3, h4,
.h1, .h2, .h3, .h4,
.display-1, .display-2, .display-3, .display-4 {
    margin-bottom: 0.5rem;
    font-family: 'Comfortaa','Noto Sans SC',sans-serif;
    font-weight: 500;
    line-height: 1.2;
}
h5, h6,
.h5, .h6 {
    margin-bottom: 0.5rem;
    font-family: 'Dosis','Noto Sans SC',sans-serif;
    font-weight: 400;
    line-height: 1.2;
}

input,
button,
select,
optgroup,
textarea {
  margin: 0;
  font-family: 'Dosis','Noto Sans SC',sans-serif;
  font-size: inherit;
  line-height: inherit;
}
  
.carousel,.sh {
  height: 100vh;
}


@media (max-width: 740px) and (orientation: landscape) {
      .sh {
        height: 200vh;
      }
      .hsh {
        height: 100vh;
      }
      .carousel {
        height: 150vh;
      }

    }

    @media (max-width: 740px)  and (orientation: portrait) { 
      .sh {
        height: 100vh;
      }

    }

@media (min-width: 800px) and (max-width: 850px) and (orientation: landscape) {

    .sh {
      height: 200vh;
    }
    }
  @media (min-width: 800px) and (max-width: 850px) and (orientation: portrait) {

      .sh {
        height: 100vh;
      }
      }
    
.parallax {
    /* The image used */
    background-image: url('../img/background.jpg');

    /* Full height */
    height: 100%; 

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
  
@media only screen and (max-device-width: 1366px) {
    .parallax {
    background-attachment: scroll;
    }
}