
/*
####################################################
M E D I A  Q U E R I E S
####################################################
*/

/*
::::::::::::::::::::::::::::::::::::::::::::::::::::
Bootstrap 4 breakpoints
*/

/*
Extra small devices (portrait phones, less than 544px)
No media query since this is the default in Bootstrap because it is "mobile first"
*/

@media (max-width: 575px) {

  .features-screenshots-img {
    margin: 0 auto;
    display: block;
    width: 80%;
  }

  .features-screenshots-img {
    margin: 0 auto;
    display: block;
  }

  .jumbo .shape {
    display: none;
  }

  footer .navbar-brand {
    display: block;
    margin : 0 auto;
  }


  .jumbo-home {
  	margin: 40px;
    text-align: center;
  }

  .home-jumbo-img {
    margin: 30px auto;
    height: 90%;
  }

  .jumbo h1 {
      font-size: 30px;
      line-height: 1em;
  }

  .cta-img {
    display: none;
  }

  .toggle-language {
    display: none;
  }

  #jumbotron-1 .shape, #jumbotron-2 .shape  {
    display: none;
  }

  .pre-features-title {
    font-size: 35px;
  }

  .cta-text {
    text-align: center;
  }

  .cta h4:before {
      top: -30px;
  }

  .navbar a.btn-primary, .cta .btn-primary {
    margin-bottom: 30px;
  }

  .dont-show {
    display: none;
  }


  .features-screenshots h2 {
    font-size: 30px;
  }

}

@media (min-width: 320px) and (max-width: 575px) {

  .features-screenshots h2 {
    font-size: 30px;
  }


  .features-screenshots-img {
    margin: 0 auto;
    display: block;
  }

  .toggle-language {
    display: none;
  }


  .jumbo .shape {
    display: none;
  }

  .jumbo-home {
  	margin: 40px 0px 40px 0;
  }

  .pre-features-title {
    font-size: 35px;
  }

  #jumbotron-1 .shape, #jumbotron-2 .shape  {
    display: none;
  }

  .img-manage, .img-automation {
    margin: 30px auto;
    width: 80%;
    display: block;
  }

  .jumbotron {
      padding: 1rem;
      text-align: center;
  }

  .cta-img {
    display: none;
  }

  .cta-text {
    text-align: center;
  }

  .cta h4:before {
      top: -30px;
  }

  footer .navbar-brand {
    display: block;
    margin : 0 auto;
  }


  .navbar a.btn-primary, .cta .btn-primary {
    margin-bottom: 30px;
  }

  .dont-show {
    display: none;
  }



}

/*Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 769px) {

  .dont-show {
    display: none;
  }

  .features-screenshots h2 {
    font-size: 30px;
  }

  .features-screenshots-img {
    margin: 0 auto;
    display: block;
    width: 80%;
  }


  .navbar a.btn-primary, .cta .btn-primary {
    margin-bottom: 30px;
  }


  .toggle-language {
    display: none;
  }

  footer .navbar-brand {
    display: block;
    margin : 0 auto;
  }


  .cta-img {
    display: none;
  }

  .cta-text {
    text-align: center;
  }

  .cta h4:before {
      top: -30px;
  }

  .jumbo .shape {
    display: none;
  }

  .col-sm-6 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }

  .home-jumbo-img {
    margin: 30px auto;
    height: 90%;
  }

  .img-manage, .img-automation {
    margin: 30px auto;
    width: 80%;
    display: block;
  }

  .jumbo h1 {
      font-size: 30px;
      line-height: 1em;
  }

  .jumbo-home {
  	margin: 40px;
    text-align: center;
  }

  .pre-features-title {
    font-size: 35px;
  }


  .jumbotron {
    padding: 1rem;
    text-align: center;

  }

  #jumbotron-1 .shape, #jumbotron-2 .shape  {
    display: none;
  }



}


/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991px)  {

.features-screenshots-img {
    margin: 0 auto;
    display: block;
  }



  .features-screenshots h2 {
    font-size: 30px;
  }


  .cta-img {
    margin-top: 60px;
  }

  .feature-title {
    font-size: 2.3rem;
  }

  #jumbotron-1 .shape {
      height: 300px;
      right: 0%;
      top: 2%;
  }

  .pre-features-title {
    font-size: 35px;
  }

  .jumbo .btn, .cta .btn, .features-screenshots .btn {
      padding: 0.75rem 1.5rem;
  }

  .jumbo .shape {
  	display: none;
  }


  .jumbo h1 {
      font-size: 40px;
      line-height: 1em;
  }

  .jumbo-home {
  	margin: 40px;
  }

  .jumbotron {
      padding: 0;
  }


}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1199px) and (max-width: 1400px) {
  .jumbo .shape {
  	height: 520px;
  	left: -22%;
  	top: -8%;
  }

}


/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199px) {

  .jumbo h1 {
      font-size: 50px;
      line-height: 1em;
  }

  .jumbo .shape {
  	height: 520px;
  	left: -30%;
  	top: -8%;
  }

  .jumbotron {
      padding: 0;
  }

  #jumbotron-1 .shape {
      height: 400px;
      right: -30%;
      top: 2%;
  }

}









/* Small devices (landscape phones, 544px and up) */
@media (min-width: 544px) {}

/* Medium devices (tablets, 768px and up) The navbar toggle appears at this breakpoint */
@media (max-width: 768px) {}

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

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