/* ====================================================
   Author       : jrtemplate
   Template     : Betra - Multipurpose
   Version      : 1.0
   Media Queries

   TOC:
	01. screen width less than 1401px and more then 1040  ( Extra large Screen / Desktop )
	02. screen width more than 1200px and less then 1300  ( Mid large Screen / Desktop )
	03. screen width less than 1200px  ( large Screen / Notebook )
	04. screen width more than 767px  ( Tablets & Desktop Screen )
	05. screen width less than 992px  ( Medium Screen / Tablets )
	06. screen width less than 801px  ( Medium wide Screen / Small Tablets )
	07. screen width less than 768px  ( Medium Screen / Smaller Tablets )
	08. screen width less than 603px  ( Medium Screen / Mobile )
	09. screen width less than 600px  ( Medium Screen / Mobile )
	10. screen width less than 500px  ( Small Screen / Mobile )
	11. screen width less than 370px  ( Smaller Screen / Mobile )

====================================================== */

@media (max-width: 1440px) {}

/* -------------------------------------------------------------
 screen width less than 1401px and more then 1040
---------------------------------------------------------------- */

@media (max-width: 1400px) and (min-width: 1040px) {}

/* -------------------------------------------------------------
 screen width more than 1200px and less then 1300
---------------------------------------------------------------- */

@media (min-width: 1200px) and (max-width: 1300px) {}

/* -------------------------------------------------------------
 screen width more than 1200px
---------------------------------------------------------------- */

@media (min-width: 1200px) {
  .container{max-width: 1280px;}
}

/* -------------------------------------------------------------
 screen width less than 1200px
---------------------------------------------------------------- */

@media (max-width: 1199px) {
  .text-box-counter-01 h1 {
    font-size: 172px;
  }
}

/* -------------------------------------------------------------
 screen width less than 992px
---------------------------------------------------------------- */

@media (max-width: 1024px) {
  .item-with-text-01 {
    margin-top: 15px;
    margin-bottom: 15px;
}
}

/* -------------------------------------------------------------
 screen width large than 991px
---------------------------------------------------------------- */

@media (min-width: 992px) {}

/* -------------------------------------------------------------
 screen width less than 992px
---------------------------------------------------------------- */

@media (max-width: 991px) {}

/* -------------------------------------------------------------
 screen width less than 801px
---------------------------------------------------------------- */

@media (max-width: 800px) {
  .item-with-text-01 {
    margin:15px 0px;
  }
  /* --- margin ---------
  ----------------------------- */
  .md-m-0{margin:0!important;}
  .md-m-0{margin:15px!important;}
  .md-m-0{margin:30px!important;}
  .md-m-0{margin:45px!important;}
  .md-m-60{margin:60px!important;}
  .md-m-100{margin:60px!important;}
  .md-mb-15{margin-bottom: 15px!important;}
  .md-mb-30{margin-bottom: 30px!important;}
  .md-mb-45{margin-bottom: 45px!important;}
  .md-mb-60{margin-bottom: 60px!important;}
  .md-mb-100{margin-bottom: 100px!important;}
  .md-mt-15{margin-top: 15px!important;}
  .md-mt-30{margin-top: 30px!important;}
  .md-mt-45{margin-top: 45px!important;}
  .md-mt-60{margin-top: 60px!important;}
  .md-mt-100{margin-top: 100px!important;}
  .md-mrl-0{margin-left: 0!important; margin-left: 0!important;}
  .md-mrl-15{margin-left: 15px!important; margin-right: 15px!important;}
  .md-mrl-30{margin-left: 30px!important; margin-right: 30px!important;}
  .md-mrl-45{margin-left: 45px!important; margin-right: 45px!important;}
  .md-mrl-60{margin-left: 60px!important; margin-right: 60px!important;}
  .md-mrl-100{margin-left: 100px!important; margin-right: 100px!important;}
  /* --- padding ---------
  ----------------------------- */
  .md-p-0{padding:0!important;}
  .md-p-15{padding:15px!important;}
  .md-p-30{padding:30px!important;}
  .md-p-45{padding:45px!important;}
  .md-p-60{padding:60px!important;}
  .md-p-100{padding:100px!important;}
  .md-pb-0{padding-bottom: 0!important;}
  .md-pb-15{padding-bottom: 15px!important;}
  .md-pb-30{padding-bottom: 30px!important;}
  .md-pb-45{padding-bottom: 45px!important;}
  .md-pb-60{padding-bottom: 60px!important;}
  .md-pb-100{padding-bottom: 100px!important;}
  .md-pt-0{padding-top: 0!important;}
  .md-pt-15{padding-top: 15px!important;}
  .md-pt-30{padding-top: 30px!important;}
  .md-pt-45{padding-top: 45px!important;}
  .md-pt-60{padding-top: 60px!important;}
  .md-pt-100{padding-top: 100px!important;}
  .md-pl-0{padding-left: 0!important;}
  .md-pl-15{padding-left: 15px!important;}
  .md-pl-30{padding-left: 30px!important;}
  .md-pl-45{padding-left: 45px!important;}
  .md-pl-60{padding-left: 60px!important;}
  .md-pl-100{padding-left: 100px!important;}
  .md-pr-0{padding-right: 0!important;}
  .md-pr-15{padding-right: 15px!important;}
  .md-pr-30{padding-right: 30px!important;}
  .md-pr-45{padding-right: 45px!important;}
  .md-pr-60{padding-right: 60px!important;}
  .md-pr-100{padding-right: 100px!important;}
  .md-prl-0{padding-left: 0!important; padding-left: 0!important;}
  .md-prl-15{padding-left: 15px!important; padding-right: 15px!important;}
  .md-prl-30{padding-left: 30px!important; padding-right: 30px!important;}
  .md-prl-45{padding-left: 45px!important; padding-right: 45px!important;}
  .md-prl-60{padding-left: 60px!important; padding-right: 60px!important;}
  .md-prl-100{padding-left: 100px!important; padding-right: 100px!important;}
  /* --- aling text ---------
  ----------------------------- */
  .md-text-center{text-align:center!important;}
  .md-text-left{text-align:left!important;}
  .md-text-right{text-align:right!important;}
  /* --- buttons ---------
  ----------------------------- */
  .btn-dual .btn {
      margin: 0 10px 10px 0;
  }
}

/* -------------------------------------------------------------
 screen width less than 768px
---------------------------------------------------------------- */

@media (max-width: 767px) {
  /* --- button ---
  ----------------------------- */
  .btn-dual .btn {
    margin: 10px auto !important;
    min-width: 160px;
  }
}

/* -------------------------------------------------------------
 screen width less than 603px
---------------------------------------------------------------- */

@media (max-width: 603px) {

  body { font-size: 13px; line-height: 20px}

  P.lead {
    font-size: 14px !important;
    line-height: 1.6;
  }
  .item-with-text-01 {
    margin-top: 0px;
    margin-bottom: 30px;
  }
  .pricing-table{
    margin-left: 15px;
    margin-right: 15px;
  }
  .blog-post {
    padding: 15px;
}

/* --- margin ---------
----------------------------- */
.sm-m-0{margin:0 !important;}
.sm-m-5{margin:5px !important;}
.sm-m-15{margin:15px !important;}
.sm-m-30{margin:30px !important;}
.sm-m-45{margin:45px !important;}
.sm-m-60{margin:60px !important;}
.sm-mb-15{margin-bottom: 15px !important;}
.sm-mb-30{margin-bottom: 30px !important;}
.sm-mb-45{margin-bottom: 45px !important;}
.sm-mb-60{margin-bottom: 60px !important;}
.sm-mt-15{margin-top: 15px !important;}
.sm-mt-30{margin-top: 30px !important;}
.sm-mt-45{margin-top: 45px !important;}
.sm-mt-60{margin-top: 60px !important;}
/* --- padding ---------
----------------------------- */
.sm-p-0{padding:0!important;}
.sm-p-5{padding:5px!important;}
.sm-p-15{padding:15px!important;}
.sm-p-30{padding:30px!important;}
.sm-p-45{padding:45px!important;}
.sm-p-60{padding:60px!important;}
.sm-pb-15{padding-bottom: 15px !important;}
.sm-pb-30{padding-bottom: 30px !important;}
.sm-pb-45{padding-bottom: 45px !important;}
.sm-pb-60{padding-bottom: 60px !important;}
.sm-pt-15{padding-top: 15px !important;}
.sm-pt-30{padding-top: 30px !important;}
.sm-pt-45{padding-top: 45px !important;}
.sm-pt-60{padding-top: 60px !important;}
.sm-pr-0{padding-right: 0!important;}
.sm-pr-15{padding-right: 15px!important;}
.sm-pr-30{padding-right: 30px!important;}
.sm-pr-45{padding-right: 45px!important;}
.sm-pr-60{padding-right: 60px!important;}
.sm-pl-0{padding-left: 0!important;}
.sm-pl-15{padding-left: 15px!important;}
.sm-pl-30{padding-left: 30px!important;}
.sm-pl-45{padding-left: 45px!important;}
.sm-pl-60{padding-left: 60px!important;}
.sm-prl-0{padding-left: 0!important; padding-left: 0!important;}
.sm-prl-15{padding-left: 15px!important; padding-right: 15px!important;}
.sm-prl-30{padding-left: 30px!important; padding-right: 30px!important;}
.sm-prl-45{padding-left: 45px!important; padding-right: 45px!important;}
.sm-prl-60{padding-left: 60px!important; padding-right: 60px!important;}

/* --- aling text ---------
----------------------------- */
.sm-text-center{text-align:center!important;}
.sm-text-left{text-align:left!important;}
.sm-text-right{text-align:right!important;}

/* --- logo ---------
----------------------------- */
.logo{max-width: 100px!important;}

/* --- navbar-nan ---------
----------------------------- */
.main-header .navbar-nav { padding: 15px 0;}

/* --- item-with-text ---------
----------------------------- */
.item-with-text-right,
.item-with-text-left {
    text-align: center;
}
.item-with-text-right i,
.item-with-text-left i {
    position: relative;
}
.item-with-text-right i {
    right: 0;
}
.item-with-text-left h6,
.item-with-text-left p{
    padding-left: 0;
}
.item-with-text-right h6,
.item-with-text-right p{
    padding-right: 0;
}
.item-with-text-right h6{
   margin-bottom: 14px;
}
.item-with-text-left .circular {
    display: inline-block;
    margin-bottom: 18px;
    max-width: 80px;
    max-height: 80px;
}
.square {
  margin-bottom: 18px;
}
.section-title h5{padding-left: 15px; padding-right: 15px;}
.section-title h5::before,
.section-title h5::after{
  content: none;
}

.btn-dual .btn {
    margin: 0 10px 10px 0;
}

}
/* -------------------------------------------------------------
 screen width less than 600px
---------------------------------------------------------------- */
@media (max-width: 600px) {}

/* -------------------------------------------------------------
 screen width less than 500px
---------------------------------------------------------------- */

@media (max-width: 500px) {

.tab-style-01 li {
    padding: 0 0 0 0;
    margin-top: 15px;
}
.tab-style-01 .nav-item .nav-link {
    font-size: 20px;
    margin-right: 25px;
}

/* -------------------------------------------------------------
 screen width less than 370px
---------------------------------------------------------------- */

@media (max-width: 370px) {}
