/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
  @media screen and (max-width: 600px) {
    .column {
      width: 100%;
      height: auto;
    }
  }

@media only screen and (max-width: 1400px) {
    .container{
        max-width: 1240px;
    }
}
@media screen and (min-width:992px) and (max-width:1200px) {
    .container{
        max-width: 100%;
        padding: 0 15px;
    }
    /****    main-banner ****/ 
    .main-banner {
        padding: 90px 0 90px;
    }
    .main-banner h1 {
        font-size: 2.2rem;
    }
    .main-banner p {
        line-height: 25px;
        font-size: 18px;
        max-width: 315px;
        font-size: 16px;
    }
    .main-banner .catch-btns {
        font-size: 16px;
        padding: 10px 22px;
        margin-top: 20px;
    }
    .main-banner .catch-btns i {
        margin: 4px 0px 0 10px;
        font-size: 15px;
    }
    .main-banner .pargh-text {
        font-size: 11px;
    }
/****    main-banner  end****/
.spn-top-heading {
	font-size: 14px;
}
h2 {
	font-size: 38px;
}
    /****  beautiful-design-section ****/
.beautiful-design-section p {
	max-width: 636px;
	margin: 0 auto;
	font-size: 16px;
}
.inner-section-bx {
	margin-top: 30px;
}
.inner-bx {
	width: 33%;
}
.inner-bx h4 {
	font-size: 1.2rem;
	line-height: 1.3em;
	margin-top: 20px;
}
.mrgin-top-50 {
	margin-top: 20px;
}
.pargh {
	font-size: 17px;
	line-height: 1.3em;
}
.how-it-work-section .pargh {
	max-width: 627px;
	font-size: 16px;
}
/****  beautiful-design-section end ****/
.work-sect h4 {
	font-size: 1.2rem;
}
.work-sect p {
	font-size: 13px;
	line-height: 1.3em;
	margin-top: 27px;
}
.how-it-work-section {
	padding: 100px 0 40px;
}
.left-section p {
	font-size: 16px;
}
.padding-ar {
	padding: 0px 0px;
}
section.inner-sect .inner-row {
	padding: 0 0px;
}
section.inner-sect .inner-row {
	padding: 0 0px;
}
.product-sect h4 {
	font-size: 1.2rem;
	margin-top: 35px;
}
.product-sect p {
	font-size: 13px;
	line-height: 1.3em;
}

}
@media screen and (min-width:768px) and (max-width: 991px) {
    .logo {
        max-width: 151px;
        width: 100%;

    }
    .container{
        max-width: 100%;
        padding: 0 15px;
    }
    .inner-bx.hide-mobs {
        display: none;
    }
    .be-inspired-section p {
        font-size: 12px;
    
    }
/****    main-banner ****/ 
    .main-banner {
        padding: 90px 0 90px;
    }
    .main-banner h1 {
        font-size: 2.2rem;
    }
    .main-banner p {
        line-height: 25px;
        font-size: 18px;
        max-width: 315px;
        font-size: 16px;
    }
    .main-banner .catch-btns {
        font-size: 16px;
        padding: 10px 22px;
        margin-top: 20px;
    }
    .main-banner .catch-btns i {
        margin: 4px 0px 0 10px;
        font-size: 15px;
    }
    .main-banner .pargh-text {
        font-size: 11px;
    }
/****    main-banner  end****/
.spn-top-heading {
	font-size: 14px;
}
h2 {
	font-size: 38px;
}
    /****  beautiful-design-section ****/
.beautiful-design-section p {
	max-width: 636px;
	margin: 0 auto;
	font-size: 16px;
}
.inner-section-bx {
	margin-top: 30px;
}
.inner-bx {
	width: 33%;
}
.inner-bx h4 {
	font-size: 1.2rem;
	line-height: 1.3em;
	margin-top: 20px;
}
.mrgin-top-50 {
	margin-top: 20px;
}
.pargh {
	font-size: 17px;
	line-height: 1.3em;
}
.how-it-work-section .pargh {
	max-width: 627px;
	font-size: 16px;
}
/****  beautiful-design-section end ****/
.work-sect h4 {
	font-size: 1.2rem;
}
.work-sect p {
	font-size: 13px;
	line-height: 1.3em;
	margin-top: 27px;
}
.how-it-work-section {
	padding: 100px 0 40px;
}
.left-section p {
	font-size: 16px;
}
.padding-ar {
	padding: 0px 0px;
}
section.inner-sect .inner-row {
	padding: 0 0px;
}
section.inner-sect .inner-row {
	padding: 0 0px;
}
.product-sect h4 {
	font-size: 1.2rem;
	margin-top: 35px;
}
.product-sect p {
	font-size: 13px;
	line-height: 1.3em;
}
.media-content {
	width: 50%;
}
.inner-bx.hide-mob {
	display: none;
}
.btop-heading::after {
	left: 105px;
	width: 95px;
}
.inspired-bx h3 {
	font-size: 1.5rem;
}
.leftt::after {
	left: 12px;
	width: 20px;
	height: 20px;
	top: -44px;
}
.leftt::before {
	left: unset;
	width: 20px;
	height: 28px;
	top: -23px;
	right: 100px;
}
.left-section.padding-ar::before {
	right: 77px;
	width: 28px;
	height: 25px;
	top: 92px;
	transform: rotate(104deg);
}
.img-responsive.star-imgg {
	display: none;
}
.left-section.padding-ar::after {
	right: 37px;
	width: 38px;
	height: 47px;
	top: -7px;
	transform: rotate(-7deg);
}
.our-product {
	padding: 10px 0 80px;
}
.our-product .btop-heading::after {
	right: 117px;
	width: 101px;
	height: 131px;
	top: -68px;
	transform: rotate(19deg);
}
.ltop-heading::after {
	right: 69px;
	width: 100px;
	height: 166px;
	top: -98px;
}
.svg-top svg {
	left: 50%;
	

}

}
@media screen and (min-width:320px) and (max-width: 767px) { 
    .container{
        max-width: 100%;
    }
    /****    main-banner ****/
    .main-banner{
        padding: 210px 0 15px;
        text-align: center;
        background-image: url(../images/Header-Image-1200x1230-1.jpg);
        background-size: 100%;
    }
    .main-banner h1 {
        font-size: 2.4rem;
        text-align: center;
        margin-top: 185px;
    }
    .main-banner .parghhh {
        font-size: 14px;
        line-height: 23px;
        width: 100%;
        overflow: hidden;
        height: 20px;
    }
    .main-banner .catch-btns {
	font-size: 1rem;
	padding: 13px 17px;
	margin: 20px auto 0px;
	text-transform: uppercase;
}
.main-banner .pargh-text {
	font-size: 0.8rem;
	margin-top: 15px;
	display: none;
}/****    main-banner end ****/
/****    your feedback  ****/
.left-area.width-50 {
	width: 100%;
	padding: 0;
	text-align: center;
}
.line.mob-lines {
	margin-top: 30px;
	margin-bottom: 0;
}
.your-feedback-section p {
	font-size: 11px;
}
.typewriter h3 {
	font-size: 23px;
}
.left-area::before ,.left-area::after ,.right-area:after{
	display: none;
}
/****    your feedback end ****/
    /****  beautiful-design-section ****/
    .spn-top-heading {
        font-size: 14px;
        max-width: 200px;
        margin: auto;
    }
    .spn-top-heading {
        font-size: 14px;
        max-width: 100%;
        margin: auto;
        text-align: center;
        max-width: 200px;
    }
    .ltop-heading::after {
        right: 36px;
        width: 100px;
        height: 100px;
        top: -63px;
    }
    h2 {
        font-size: 36px;
        margin-top: 20px;
    }
    .pargh {
        font-size: 16px;
        line-height: 1.3em;
    }
    .beautiful-design-section p {
        max-width: 291px;
    }
    .line {
        max-width: 65px;
    }
    .inner-bx {
        width: 50%;
    }
    .inner-bx h4 {
        font-size: 1.2rem;
        margin-top: 20px;
    }
    .mrgin-top-50 {
        margin-top: 10px;
    }
    .exlpore-btns {
        padding: 10px 24px;
    }
    .hide-mob{
        display: none;
    }
     /****  beautiful-design-section end ****/
     /****  email-reminder-section ****/
     .svg-top svg {
        width: calc(200% + 1.3px);
        height: 20px;
    }
    .email-reminder-section form {
        padding: 0 40px;
    }
    .remind-btns {
        width: 100%;
        margin-top: 10px;
    }
    .email-reminder-section .spn-top-heading {
        max-width: 174px;
    }
    .top-headings::before {
        left: 21px;
        width: 20px;
        height: 20px;
        top: 31px;
        transform: rotate(12deg);
    }
    /****   email-reminder-section end ****/
    .top-headings::after {
        right: 42px;
        width: 23px;
        height: 23px;
        top: -23px;
    }
    .btop-heading::after {
        left: 18px;
        width: 100px;
        height: 100px;
        top: -58px;
    }
    /****  how-it-work-section  ****/
    .work-sect {
        width: 100%;
        margin-bottom: 40px;
    }
    .work-sect h4 {
        font-size: 1.1rem;
    }
    .work-sect p {
        font-size: 16px;
    }
    /****  how-it-work-section end  ****/
    /********* inner-sect  *********/
    section.inner-sect .inner-row {
        padding: 0 0px;
    }
    .left-section, .right-section {
        width: 100%;
        text-align: center;
    }
    .leftt::after {
        left: 33px;
        width: 20px;
        height: 20px;
        top: 18px;
    }
    .left-section.padding-ar .spn-top-heading {
        max-width: 100%;
    }
    .leftt::before {
        right: 0;
        width: 20px;
        height: 20px;
        top: -42px;
    }
    .left-section.padding-ar::before {
        left: 31px;
        width: 20px;
        height: 20px;
        top: -5px;
        transform: rotate(104deg);
    }
    .left-section.padding-ar::after {
        display: none;
    }
    .left-section.leftt .lines, .left-section.padding-ar .lines{
        margin: 0px auto 30px;
    }
    .img-responsive.star-imgg {
        height: 20px;
        width: 20px;
        top: 47px;
        left: 23px;
    }
    .left-section p {
        font-size: 16px;
    }
    .right-section img {
        width: 100%;
    }
    .right-section.text-center {
        margin-top: 30px;
    }
    .mar-auto {
        margin: 40px 0;
    }
    .left-section.order-2.padding-ar {
        padding: 20px 0;
    }
    .left-section.order-2.padding-ar {
        order: 1;
    }
    .right-section.order-1 {
        order: 2;
    }
    /********* inner-sect end  *********/
    .our-product {
        padding: 15px 0 80px;
    }
    .our-product .btop-heading::after {
        left: unset;
        right: 0;
        width: 100px;
        height: 100px;
        top: -63px;
    }
    .product-sect {
        width: 100%;
        margin-bottom: 20px;
    }
     /*********  Be Inspired section begin *********/
    .width-50 {
        width: 100%;
    }
    .be-inspired-section p {
        font-size: 14px;
        text-align: center;
        max-width: 226px;
        line-height: 23px;
        margin: auto;
    }
   .left-inspired {
        order: 1;
        text-align: center;
    }
    .right-inspired {
        order: 0;
    }
    .left-inspired::before {
        left: 30px;
        width: 20px;
        height: 20px;
        top: -127px;
    }
    .left-inspired::after {
        right: 46px;
        width: 25px;
        height: 25px;
        top: -95px;
    }
    .width-mob{
        width:50%;
    }
    .inspired-sect {
        grid-template-columns: unset;
    }
    .inspired-caption p {
        font-size: 14px;
        text-align: left;
        max-width: 100%;
    }
    .media-content {
        width: 100%;
        text-align: center;
    }
    .media-content-left {
        width: 100%;
        margin-bottom: 20px;
    }
    .media-content-right{
        width: 100%;
    } 
    .media-content {
        width: 100%;
        text-align: center;
        margin-bottom: 30px;
    }
    .inspired-bx h3 {
        font-size: 1.4rem;
    }
    .inspired-bx h4 {
        font-size: 1.2rem;
    }
    .your-feedback-section {
        padding: 0px 0 50px;

    }
    /*********** navbar **********/
    .navbar.navbar-mob {
        /* display:none; */
        position: absolute;
        width: 270px;
        background-color: #ffff;
        max-height: 100vh;
        position: fixed;
        z-index: 102;
        padding: 0 15px;
        top: 0;
        left: 0;
        bottom: 0;
        height: 100%;
        width: 260px;
        min-height: 100vh;
        min-height: fill-available;
        min-height: -webkit-fill-available;
        max-height: 100vh;
        overflow-y: auto;
        overflow-x: hidden;
        background: #fff;
        background-color: rgb(255, 255, 255);
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
        box-shadow: 0 0 10 rgba(0,0,0,.15);
        transition: all .35s;
        transition-delay: 0s;
        transition-delay: .1s;
        padding: 24px 10px;
    }
    .navbar a {
        font-size: 16px;
        width: 100%;
        text-align: left;
    }
    .dropdown, .dropps {
        width:100%;
    }
    .dropdown-content {
        position: relative;
        top: 0;
    }
    .column {
        margin: 10px 0;
        border:0px;
    }
    .column a{
        padding:0;     
    }
    .dropdown-contents.dropp {
        position: unset; 
        top: 0;
        padding: 0;
        width: unset;
        float: left;
        max-width: 400px;
        text-align: left;
    }
    .dropdown-contents {
        box-shadow: unset;
    }
    .dropdowns .dropbtns {
        width: 100%;
        text-align: left;
    }
    .navbar a{
        font-size: 16px;
        padding: 7px 6px;
        text-decoration: none;
    }
    .dropdowns .dropbtns, .dropdown .dropbtn {
        padding: 7px 6px;
        width: 100%;
        text-align: left;
    }
    .logo {
        max-width: 151px;
        width: 100%;

    }

}