/* Extra small devices (portrait phones, less than 576px) */
 @media (max-width: 575.98px) {

     /* header section  */
     .navbar-toggler {
         background-color: #fff !important;
     }

     .navbar-nav {
         margin-top: 10px !important;
     }

     .menu li {
         margin-right: 0 !important;
     }

     .menu li a {
         margin: -3px 0;
     }

     .menu li:last-child {
         margin-right: 0 !important;
     }

     /* hero section  */
     .offset-2 {
         margin: 0 !important;
     }

     .c-hero {
         padding: 60px 0;
         text-align: center;
     }

     .hero-left h1 {
         margin: 30px 0;
         font-size: 25px;
     }

     .hero-right {
         margin-top: 40px;
     }

     .hero-left h1 {
         margin: 20px 0;
     }

     .hero-right input {
         margin: 15px 0;
     }

     .hero-right h2 {
         padding: 10px 0;
     }

     .hero-left hr {
         margin: 0 auto;
     }

     .hero-left p {
         margin-top: 15px;
         margin-bottom: 15px;
     }

     /* social section start  */
     .social {
         padding: 60px 0;
         text-align: center;
     }

     .social-right a {
         margin-right: 15px;
         font-size: 20px;
     }

     /* social section end  */

     /* tab section  */
     .tab {
         position: relative;
         padding-top: 100px;
         padding-bottom: 45px;
     }

     .tab img {
         margin-top: 42px;
     }

     .c-button {
         margin-top: 30px;
         width: 23%;
         position: absolute;
         top: -39px;
         transform: rotate(90deg);
         left: 83px;
     }

     .c-button button {
         margin-top: 1px;
         width: 72px;
         height: 72px;
         border-radius: 0 !important;
         color: #fff;
         background-color: #212121 !important;
         transform: rotate(-90deg);
     }

     .tab-wrapper {
         margin-top: 60px;
     }

     #v-pills-home-tab {
         order: 3 !important;
     }

     #v-pills-profile-tab {
         order: 2 !important;
     }

     .tab h1 {
         margin: 12px 0;
         font-size: 17px;
     }

     /* sub section  */
     .sub {
         margin: 60px 0;
         text-align: center;
     }

     .sub-content a {
         padding: 6px;
     }

     .sub-content h1 {
         font-size: 17px;
     }

     .sub-content p {
         margin-bottom: 20px;
         margin-top: 5px;
     }

     .sub-content hr {
         margin: 0 auto;
         width: 9%;
     }

     .sub-cont-item {
         margin: 17px;
     }

     /* stand section  */
     .stand {
         padding: 60px 0;
         text-align: center;
     }

     .c-stand {
         padding: 0;
     }

     .stand-contant hr {
         margin: 0 auto;
         width: 9%;
     }

     .stand-contant p {
         margin-top: 5px;
     }

     /* awesome section  */
     .awesome {
         margin: 60px 0;
     }

     .awesome h1 {
         font-size: 20px;
     }

     .awesome-item h2 {
         margin: 5px 0;
     }

     .awesome-item i {
         padding: 7px;
         width: 14%;
         font-size: 20px;
     }

     .awesome hr {
         margin: 8px 0;
         width: 9%;
     }

     /* pricing section  */
     .pricing {
         padding: 60px 0;
     }

     .item-extra {
         margin-top: 44px;
         margin-bottom: 0;
     }

     .pricing h1 {
         font-size: 20px;
     }

     .margin-c {
         margin: 0;
     }

     .pricing-item h2 {
         padding: 5px 0;
     }

     .bg-cor h3 span {
         font-size: 30px;
     }

     .bg-cor h3 {
         font-size: 18px;
     }

     .c-most {
         font-weight: 400;
     }

     /* review section  */
     .review {
         margin: 60px 0;
         padding: 0;
     }

     .review-c p::after {
         top: 97%;
         left: 40px;
     }

     .review h1 {
         font-size: 20px;
     }

     .review hr {
         margin: 8px 0;
         width: 9%;
     }

     .review p {
         margin-bottom: 15px;
     }

     .review-c h2 {
         font-size: 18px;
     }

     /* style section  */
     .style {
         margin: 60px 0;
     }

     .style h1 {
         font-size: 20px;
     }

     .style hr {
         margin: 8px 0;
         width: 9%;
     }

     .style p {
         margin-bottom: 10px;
     }

     .style button {
         width: 31%;
         padding: 5px;
     }

     /* contact section  */
     .contact {
         margin: 60px 0;
         padding: 0;
     }

     .contact h1 {
         font-size: 20px;
     }

     .contact hr {
         margin: 8px 0;
         width: 9%;
     }

     .contact input {
         margin: 10px 0;
         padding: 5px;
     }

     .contact button {
         width: 45%;
         padding: 7px;
     }

     /* footer section  */
     footer p a {
         margin-right: 15px;
         font-size: 20px;
     }

     /* scrolltop button  */
     #topbtn {
         right: 25px;
         bottom: 40px;
         font-size: 20px;
         width: 40px;
         height: 40px
     }

 }

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

     /* header section  */
     .navbar-toggler {
         background-color: #fff !important;
     }

     .navbar-nav {
         margin-top: 10px;
     }

     .menu li:last-child {
         margin-right: 45px !important;
     }

     /* hero section  */
     .offset-2 {
         margin: 0 !important;
     }

     .c-hero {
         padding: 80px 0;
         text-align: center;
     }

     .hero-right {
         margin-top: 80px;
     }

     .hero-left h1 {
         margin: 20px 0;
     }

     .hero-right input {
         margin: 15px 0;
     }

     .hero-right h2 {
         padding: 10px 0;
     }

     .hero-left hr {
         margin: 0 auto;
     }

     .hero-left p {
         margin-top: 15px;
         margin-bottom: 15px;
     }

     /* social section start  */
     .social {
         text-align: center;
         padding: 5px 0;
     }

     .social-right a {
         margin-right: 18px;
         font-size: 25px;
     }

     /* social section end  */

     /* tab section  */
     .tab {
         position: relative;
         padding-top: 100px;
         padding-bottom: 45px;
     }

     .tab img {
         margin-top: 42px;
     }

     .c-button {
         margin-top: 30px;
         width: 23%;
         position: absolute;
         top: 10px;
         transform: rotate(90deg);
         left: 144px;
     }

     .c-button button {
         width: 74px;
         height: 70px;
         margin-bottom: 4px;
         border-radius: 0 !important;
         color: #fff;
         background-color: #212121 !important;
         transform: rotate(-90deg);
     }

     .tab-wrapper {
         margin-top: 60px;
     }

     #v-pills-home-tab {
         order: 3 !important;
     }

     #v-pills-profile-tab {
         order: 2 !important;
     }

     .tab h1 {
         margin: 20px 0;
     }

     /* sub section  */
     .sub {
         margin: 80px 0;
         text-align: center;
     }

     .sub-content a {
         padding: 6px;
     }

     .sub-content p {
         margin-bottom: 30px;
         margin-top: 5px;
     }

     .sub-content hr {
         margin: 0 auto;
         width: 9%;
     }

     .sub-cont-item {
         margin: 17px;
     }

     /* stand section  */
     .stand {
         padding: 80px 0;
         text-align: center;
     }

     .c-stand {
         padding: 0;
     }

     .stand-contant hr {
         margin: 0 auto;
         width: 9%;
     }

     .stand-contant p {
         margin-top: 5px;
     }

     /* awesome section  */
     .awesome {
         margin: 80px 0;
     }

     .awesome h1 {
         font-size: 25px;
     }

     .awesome-item h2 {
         margin: 5px 0;
     }

     .awesome-item i {
         padding: 10px;
         width: 10%;
         font-size: 20px;
     }

     .awesome hr {
         margin: 8px 0;
         width: 9%;
     }

     /* pricing section  */
     .pricing {
         padding: 80px 0;
     }

     .item-extra {
         margin-top: 44px;
     }

     .pricing h1 {
         font-size: 25px;
     }

     .margin-c {
         margin: 0;
     }

     .pricing-item h2 {
         padding: 5px 0;
     }

     .bg-cor h3 span {
         font-size: 35px;
     }

     .bg-cor h3 {
         font-size: 20px;
     }

     .c-most {
         font-weight: 400;
     }

     /* review section  */
     .review {
         margin: 80px 0;
     }

     .review h1 {
         font-size: 25px;
     }

     .review hr {
         margin: 8px 0;
         width: 9%;
     }

     .review p {
         margin-bottom: 15px;
     }

     .review-c p::after {
         top: 96%;
         left: 67px;
     }

     /* style section  */
     .style {
         margin: 80px 0;
     }

     .style h1 {
         font-size: 25px;
     }

     .style hr {
         margin: 8px 0;
         width: 9%;
     }

     .style p {
         margin-bottom: 15px;
     }

     .style button {
         width: 20%;
     }

     /* contact section  */
     .contact {
         margin: 80px 0;
     }

     .contact h1 {
         font-size: 25px;
     }

     .contact hr {
         margin: 8px 0;
         width: 9%;
     }

     .contact input {
         margin: 10px 0;
         padding: 5px;
     }

     .contact button {
         width: 25%;
     }

     /* footer section  */
     footer p a {
         margin-right: 15px;
         font-size: 20px;
     }
 }

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

     /* header section  */
     .navbar-toggler {
         background-color: #fff !important;
     }

     .navbar-nav {
         margin-top: 10px;
     }

     .menu li:last-child {
         margin-right: 45px !important;
     }

     /* hero section  */
     .offset-2 {
         margin: 0 !important;
     }

     .c-hero {
         padding: 90px 0;
     }

     .hero-left h1 {
         margin: 20px 0;
     }

     .hero-left hr {
         margin-bottom: 20px;
     }

     .hero-left p {
         margin-bottom: 20px;
     }

     /* social section start  */
     .social {
         padding: 5px 0;
     }

     .social-right a {
         margin-right: 21px;
         font-size: 28px;
     }

     /* social section end  */

     /* tab section  */
     .tab {
         padding: 90px 0;
     }

     .c-button {
         width: 62%;
     }

     .tab h1 {
         margin-bottom: 20px;
     }

     /* sub section  */
     .sub {
         margin: 90px 0;
     }

     .sub-content a {
         padding: 6px;
     }

     .sub-content p {
         margin-bottom: 30px;
     }

     .sub-content hr {
         margin: 10px 0;
     }

     /* stand section  */
     .c-stand {
         padding: 90px 0;
     }


     /* awesome section  */
     .awesome {
         margin: 90px 0;
     }

     .awesome h1 {
         font-size: 30px;
     }

     .awesome-item h2 {
         margin: 10px 0;
     }

     .awesome-item i {
         width: 26%;
         font-size: 25px;
     }

     /* pricing section  */
     .pricing {
         padding: 90px 0;
     }

     .pricing h1 {
         font-size: 30px;
     }

     .margin-c {
         margin-bottom: 30px;
     }

     .pricing-item h2 {
         padding: 15px 0;
     }

     .bg-cor h3 span {
         font-size: 55px;
     }

     .bg-cor h3 {
         font-size: 30px;
     }

     .c-most {
         font-weight: 400;
     }

     /* review section  */
     .review {
         margin: 90px 0;
     }

     .review-c p::after {
         top: 98%;
         left: 37px;
     }

     .review h1 {
         font-size: 30px;
     }

     .review hr {
         margin: 15px 0;
     }

     /* style section  */
     .style {
         margin: 90px 0;
     }

     .style h1 {
         font-size: 30px;
     }

     /* contact section  */
     .contact {
         margin: 90px 0;
     }

     .contact h1 {
         font-size: 30px;
     }

     .contact hr {
         margin: 15px 0;
     }

     .contact input {
         margin: 10px 0;
         padding: 5px;
     }

     .contact button {
         width: 20%;
     }

     /* footer section  */
     footer p a {
         margin-right: 15px;
         font-size: 20px;
     }
 }

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

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

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