/* -----------------------------------------------

				CSS Styles 

--------------------------------------------------



    Template Name: Mariam - Personal Portfolio Template

    

--------------------------------------------------



Table of Content



	- Global

	- Header Left

	- Menu 

	- Home 

	- About 

	- Services 

	- Works 

    - Testimonials

    - Blog

	- Contact 

	- Preloader 

	- Responsive

 



----------------------------------- */

/* -----------------------------------

		 Global

----------------------------------- */

* {

  margin: 0;

  padding: 0;

  font-family: inherit;

  outline: none !important;

  list-style: none !important;

  text-decoration: none !important;

}



*:after,

*:before {

  -webkit-box-sizing: border-box;

          box-sizing: border-box;

  padding: 0;

  margin: 0;

}



html {

  scroll-behavior: smooth;

  overflow-x: hidden;

}



body {

  font-family: "Muli", sans-serif;

  background-color: #ffffff;

  overflow-x: hidden;

}



h1, h2, h3, h4, h5, h6 {

  font-family: "Poppins", sans-serif;

  font-weight: 600;

  line-height: 1.618;

}



h1 {

  font-size: 40px;

}



h2 {

  font-size: 32px;

}



h3 {

  font-size: 28px;

}



h4 {

  font-size: 24px;

}



h5 {

  font-size: 20px;

}



h6 {

  font-size: 16px;

}



a {

  outline: none !important;

  -webkit-transition: all 0.5s ease;

  transition: all 0.5s ease;

}



a:hover, a:focus {

  text-decoration: none;

}



.base-color {

  color: #f21e4e !important;

}



.bg-base-color {

  background-color: #f21e4e;

}



.font-w-600 {

  font-weight: 600;

}



.font-w-700 {

  font-weight: 700;

}



.max-width-450 {

  max-width: 450px;

}



.full-width {

  width: 100%;

}



img {

  max-width: 100%;

  height: auto;

}



ul {

  margin-bottom: 0;

}



.list-inline li {

  display: inline-block;

}



.main {

  height: 100%;

  margin-left: 100px;

  -webkit-transition: all 0.5s ease;

  transition: all 0.5s ease;

}



.section {

  padding: 70px 40px 0px 40px;

}



.section-title {

  position: relative;

  padding-left: 15px;

  z-index: 1;

}



.section-title:after {

  position: absolute;

  content: "";

  left: 0px;

  top: 6px;

  width: 40px;

  height: 40px;

  background-color: rgba(242, 30, 78, 0.1);

  border-radius: 50%;

  z-index: -1;

}



.section-title h2 {

  text-transform: capitalize;

  font-weight: 700;

}



.section-title p {

  text-transform: capitalize;

}



.social-footer {

  display: none;

  position: fixed;

  bottom: 25px;

  z-index: 99;

  margin-left: 20px;

  text-align: center;

  background-color: transparent;

  -webkit-transition: all 0.5s ease-in-out;

  transition: all 0.5s ease-in-out;

}



.social-footer ul li:not(:last-child) {

  padding-right: 15px;

}



.social-footer i {

  font-size: 16px;

}



.social-footer i:hover {

  color: #f21e4e;

}



.social-footer.active {

  display: block;

}



.social-footer a {

  width: 30px;

  height: 30px;

  background-color: #ffffff;

  border-radius: 50%;

  text-align: center;

  margin: auto;

  display: inline-block;

  -webkit-transition: all 0.7s ease;

  transition: all 0.7s ease;

  -webkit-box-shadow: 0px 5px 20px 0px rgba(69, 67, 96, 0.1);

          box-shadow: 0px 5px 20px 0px rgba(69, 67, 96, 0.1);

}



.social-footer a i {

  line-height: 30px;

  text-align: center;

}



/* ---------- Buttons ---------  */

.btn-custom {

  cursor: pointer;

  display: -webkit-inline-box;

  display: -ms-inline-flexbox;

  display: inline-flex;

  text-align: center;

  white-space: nowrap;

  vertical-align: middle;

  position: relative;

  background-color: #12a89d;

  line-height: 24px;

  border: 0;

  color: #ffffff;

  font-size: 16px;

  font-weight: 500;

  padding: 10px 24px;

  text-transform: capitalize;

  border-radius: 5px;

  z-index: 1;

  -webkit-transition: all 0.3s ease;

  transition: all 0.3s ease;

}

.full-width ul{list-style:square; margin-left:30px;}

.full-width li{ list-style:square !important;}

.btn-custom i {

  margin-right: 8px;

}



.btn-custom .arrow_right {

  margin-top: 6px;

  margin-left: 5px;

}



.btn-custom::after {

  position: absolute;

  content: "";

  left: 0px;

  top: 0px;

  width: 100%;

  height: 100%;

  background-color: #343a40;

  z-index: -1;

  -webkit-transform-origin: center;

          transform-origin: center;

  -webkit-transform: scale(0);

          transform: scale(0);

  border-radius: 5px;

  -webkit-transition: all 0.3s ease;

  transition: all 0.3s ease;

}



.btn-custom:hover::after, .btn-custom:focus::after {

  -webkit-transform: scale(1);

          transform: scale(1);

}



.btn-custom:hover, .btn-custom:focus {

  color: #ffffff;

  outline: none;

}



/* ---------- Custom Margin Top --------- */

.mt-0 {

  margin-top: 0px !important;

}



.mt-5 {

  margin-top: 5px !important;

}



.mt-10 {

  margin-top: 10px !important;

}



.mt-15 {

  margin-top: 15px !important;

}



.mt-20 {

  margin-top: 20px !important;

}



.mt-25 {

  margin-top: 25px !important;

}



.mt-30 {

  margin-top: 30px !important;

}



.mt-35 {

  margin-top: 35px !important;

}



.mt-40 {

  margin-top: 40px !important;

}



.mt-45 {

  margin-top: 45px !important;

}



.mt-50 {

  margin-top: 50px !important;

}



.mt-55 {

  margin-top: 55px !important;

}



.mt-60 {

  margin-top: 60px !important;

}



.mt-65 {

  margin-top: 65px !important;

}



.mt-70 {

  margin-top: 70px !important;

}



.mt-75 {

  margin-top: 75px !important;

}



.mt-80 {

  margin-top: 80px !important;

}



.mt-85 {

  margin-top: 85px !important;

}



.mt-90 {

  margin-top: 90px !important;

}



.mt-95 {

  margin-top: 95px !important;

}



.mt-100 {

  margin-top: 100px !important;

}



/* Custom Margin Bottom */

.mb-0 {

  margin-bottom: 0px !important;

}



.mb-5 {

  margin-bottom: 5px !important;

}



.mb-10 {

  margin-bottom: 10px !important;

}



.mb-15 {

  margin-bottom: 15px !important;

}



.mb-20 {

  margin-bottom: 20px !important;

}



.mb-25 {

  margin-bottom: 25px !important;

}



.mb-30 {

  margin-bottom: 30px !important;

}



.mb-35 {

  margin-bottom: 35px !important;

}



.mb-40 {

  margin-bottom: 40px !important;

}



.mb-45 {

  margin-bottom: 45px !important;

}



.mb-50 {

  margin-bottom: 50px !important;

}



.mb-55 {

  margin-bottom: 55px !important;

}



.mb-60 {

  margin-bottom: 60px !important;

}



.mb-65 {

  margin-bottom: 65px !important;

}



.mb-70 {

  margin-bottom: 70px !important;

}



.mb-75 {

  margin-bottom: 75px !important;

}



.mb-80 {

  margin-bottom: 80px !important;

}



.mb-85 {

  margin-bottom: 85px !important;

}



.mb-90 {

  margin-bottom: 90px !important;

}



.mb-95 {

  margin-bottom: 95px !important;

}



.mb-100 {

  margin-bottom: 100px !important;

}



/* Custom Padding top */

.pt-0 {

  padding-top: 0px !important;

}



.pt-5 {

  padding-top: 5px !important;

}



.pt-10 {

  padding-top: 10px !important;

}



.pt-15 {

  padding-top: 15px !important;

}



.pt-20 {

  padding-top: 20px !important;

}



.pt-25 {

  padding-top: 25px !important;

}



.pt-30 {

  padding-top: 30px !important;

}



.pt-35 {

  padding-top: 35px !important;

}



.pt-40 {

  padding-top: 40px !important;

}



.pt-45 {

  padding-top: 45px !important;

}



.pt-50 {

  padding-top: 50px !important;

}



.pt-55 {

  padding-top: 55px !important;

}



.pt-60 {

  padding-top: 60px !important;

}



.pt-65 {

  padding-top: 65px !important;

}



.pt-70 {

  padding-top: 70px !important;

}



.pt-75 {

  padding-top: 75px !important;

}



.pt-80 {

  padding-top: 80px !important;

}



.pt-85 {

  padding-top: 85px !important;

}



.pt-90 {

  padding-top: 90px !important;

}



.pt-95 {

  padding-top: 95px !important;

}



.pt-100 {

  padding-top: 100px !important;

}



/* Custom Padding top */

.pb-0 {

  padding-bottom: 0px !important;

}



.pb-5 {

  padding-bottom: 5px !important;

}



.pb-10 {

  padding-bottom: 10px !important;

}



.pb-15 {

  padding-bottom: 15px !important;

}



.pb-20 {

  padding-bottom: 20px !important;

}



.pb-25 {

  padding-bottom: 25px !important;

}



.pb-30 {

  padding-bottom: 30px !important;

}



.pb-35 {

  padding-bottom: 35px !important;

}



.pb-40 {

  padding-bottom: 40px !important;

}



.pb-45 {

  padding-bottom: 45px !important;

}



.pb-50 {

  padding-bottom: 50px !important;

}



.pb-55 {

  padding-bottom: 55px !important;

}



.pb-60 {

  padding-bottom: 60px !important;

}



.pb-65 {

  padding-bottom: 65px !important;

}



.pb-70 {

  padding-bottom: 70px !important;

}



.pb-75 {

  padding-bottom: 75px !important;

}



.pb-80 {

  padding-bottom: 80px !important;

}



.pb-85 {

  padding-bottom: 85px !important;

}



.pb-90 {

  padding-bottom: 90px !important;

}



.pb-95 {

  padding-bottom: 95px !important;

}



.pb-100 {

  padding-bottom: 100px !important;

}



/* -----------------------------------

		    Header Left

----------------------------------- */

.header-left {

  position: fixed;

  width: 150px;

  height: 100vh;

  background-color: #ffffff;

  border-right: 1px solid #f8f9fa;

  z-index: 999;

  -webkit-transition: all 0.5s ease;

  transition: all 0.5s ease;

}



.header-left.open {

  -webkit-transform: translateX(0px);

          transform: translateX(0px);

  width: 100%;

}



.logo {

  position: absolute;

  top: 0px;

  left: 0;

  right: 0;

  text-align: center;

  border-radius: 50%;



}



.logo a {

  font-weight: 500;

  font-family: "Poppins", sans-serif;

  font-size: 18px;

  line-height: 40px;

  text-align: center;

}



.btn-share {

  position: absolute;

  bottom: 30px;

  left: 0;

  right: 0;

  line-height: 1;

  text-align: center;

}



.btn-share span {

  font-size: 20px;

}



/* -----------------------------------

		Menu

----------------------------------- */

.main-menu {

  position: fixed;

  -webkit-transform-origin: left top;

          transform-origin: left top;

  -webkit-transform: rotate(-90deg) translateX(-100%);

          transform: rotate(-90deg) translateX(-100%);

  width: 100vh;

  height: 100px;

  padding-top: 20px;

    padding-right: 60px;

}



.main-menu .cross {

  display: none;

  width: 35px;

  height: 35px;

  text-align: center;

  border-radius: 50%;

  position: absolute;

  right: 35px;

  top: 35px;

}



.main-menu .cross i {

  line-height: 35px;

}



.main-menu .menu {

  display: -webkit-box !important;

  display: -ms-flexbox !important;

  display: flex !important;

  -ms-flex-preferred-size: auto;

  flex-basis: auto;

}



.main-menu .menu .menu-nav {

  margin: -2px auto 0 auto;

  height: 100px;

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  padding-left: 0;

  -webkit-box-orient: horizontal;

  -webkit-box-direction: reverse;

  -ms-flex-direction: row-reverse;

      flex-direction: row-reverse;

}



.nav-link {

  float: right;

  height: 100%;

  line-height: 100px;

  padding: 0px 15px;

  text-align: center;

  color: #343a40;

  font-size: 16px;

  font-weight: 500;

  position: relative;

  text-transform: capitalize;

  -webkit-transition: all 0.5s ease;

  transition: all 0.5s ease;

}



.nav-link.active, .nav-link:focus, .nav-link:hover {

  color: #f21e4e !important;

  -webkit-transition: all 0.5s ease;

  transition: all 0.5s ease;

}



.nav-link:hover:after, .nav-link.active:after {

  position: absolute;

  content: "";

  left: 0px;

  top: auto;

  width: 6px;

  height: 6px;

  background-color: #f21e4e;

  right: 0;

  bottom: 30px;

  border-radius: 50%;

  text-align: center;

  margin: auto;

}



.menu-toggle {

  right: 40px;

  top: 30px;

  z-index: 999;

  text-align: center;

  position: fixed;

  width: 35px;

  height: 35px;

  display: none;

  background-color: #f21e4e;

  border-radius: 50%;

}



.menu-toggle span {

  width: 5px;

  height: 5px;

  background-color: #ffffff;

  display: block;

  position: absolute;

  top: 15px;

  left: 15px;

  border-radius: 50%;

}



.menu-toggle span:after, .menu-toggle span:before {

  height: 5px;

  width: 5px;

  background-color: #ffffff;

  position: absolute;

  content: "";

  display: block;

  border-radius: 50%;

}



.menu-toggle span:after {

  bottom: -9px;

}



.menu-toggle span:before {

  top: -9px;

}



/* ------------------------------

		 Home

------------------------------ */

.home {

  background-size: cover;

  background-position: center center;

  padding-left: 40px;

  padding-right: 40px;

}



.home .social-home {

  position: absolute;

  top: 5px;

}



.home .social-home ul li:not(:last-child) {

  padding-right: 15px;

}



.home .social-home i {

  font-size: 16px;

}



.home .social-home i:hover {

  color: #f21e4e;

}



.home .banner h6 {

  font-weight: 400;

  letter-spacing: 1px;

}



.home .banner h1 {

  font-weight: 800;

}



.home .banner h1.cd-headline {

  font-size: 40px;

  font-weight: 800;

}



.home .banner h1.cd-headline.clip span {

  padding: 0;

}



.home .banner h1.cd-headline .cd-words-wrapper b {

  font-weight: 800;

}



.home .banner h1.cd-headline .cd-words-wrapper:after {

  background-color: transparent;

}



.my-info {

  width: 100%;

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  position: absolute;

  bottom: 10px;

}



.my-info .item {

  padding-right: 30px;

}



.my-info .item p:last-child {

  font-size: 15px;

}



/* ------------------------------

		 About  

------------------------------ */

.about .hero {

  border: 1px solid #f8f9fa;

  padding: 6px;

  border-radius: 5px;

}



.about .hero img {

  border-radius: 5px;

}



.about .details .info {

  display: inline-block;

  width: 100%;

}



.about .details .info li {

  margin-bottom: 10px;

  width: 50%;

  float: left;

}



.about .features .item {

  padding: 24px 20px 20px 20px;

  text-align: center;

  margin-bottom: 30px;

  background-color: #f8f9fa;

  border-radius: 5px;

}



.about .features .item .icon i {

  font-size: 25px;

}



.about .timeline {

  background-color: #ffffff;

  border-radius: 5px;

  padding: 30px;

  margin-bottom: 30px;

  -webkit-box-shadow: 0px 5px 20px 0px rgba(69, 67, 96, 0.1);

          box-shadow: 0px 5px 20px 0px rgba(69, 67, 96, 0.1);

}



.about .timeline .item {

  position: relative;

  padding: 0;

  border-radius: 5px;

}



.about .timeline .item::after {

  position: absolute;

  content: "";

  left: -6px;

  top: 6px;

  width: 13px;

  height: 13px;

  background-color: #f21e4e;

  border-radius: 50%;

}



.about .timeline .item .content {

  padding: 0px 0px 50px 50px;

  border-left: 1px solid #f21e4e;

}



.about .timeline .item .content h6 {

  text-transform: capitalize;

  font-weight: 500;

}



.about .timeline .item:last-child .content {

  padding-bottom: 0;

}



/* ------------------------------

		. Services 

------------------------------ */

.services .item {

  padding: 30px;

  margin-bottom: 30px;

  text-align: center;

  border-radius: 5px;

  background-color: #f8f9fa;

  -webkit-transition: all 0.7s ease;

  transition: all 0.7s ease;

}



.services .item:hover {

  -webkit-transform: translateY(-10px);

          transform: translateY(-10px);

  background-color: #ffffff;

  -webkit-box-shadow: 0px 5px 20px 0px rgba(69, 67, 96, 0.1);

          box-shadow: 0px 5px 20px 0px rgba(69, 67, 96, 0.1);

}



.services .item:hover .circle {

  border: 1px solid #ffffff;

  background-color: rgba(242, 30, 78, 0.1);

}



.services .item .circle {

  width: 80px;

  height: 80px;

  background-color: transparent;

  border-radius: 50%;

  text-align: center;

  margin: auto;

  border: 1px solid #f21e4e;

  -webkit-transition: all 0.5s ease;

  transition: all 0.5s ease;

}



.services .item .circle h2 {

  line-height: 80px;

  color: #f21e4e;

  font-weight: 700;

}



/* ------------------------------

		 Works

------------------------------ */

.works .item {

  margin-bottom: 30px;

  border-radius: 5px;

  -webkit-box-shadow: 0px 5px 20px 0px rgba(69, 67, 96, 0.1);

          box-shadow: 0px 5px 20px 0px rgba(69, 67, 96, 0.1);

}



.works .item .image {

  position: relative;

  overflow: hidden;

}



.works .item .image img {

  -webkit-transition: all 0.6s ease;

  transition: all 0.6s ease;

}



.works .item .image .overly {

  opacity: 0;

  position: absolute;

  width: 100%;

  height: 100%;

  top: 0;

  left: 0;

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: center;

      -ms-flex-align: center;

          align-items: center;

  -webkit-box-pack: center;

      -ms-flex-pack: center;

          justify-content: center;

  -webkit-transition: all 0.7s ease;

  transition: all 0.7s ease;

}



.works .item .image .overly .view-work {

  color: #ffffff;

  border: 1px solid #ffffff;

  padding: 6px 16px;

  border-radius: 5px;

}



.works .item .image:hover img {

  -webkit-transform: scale(1.2);

          transform: scale(1.2);

}



.works .item .image:hover .overly {

  background-color: rgba(34, 34, 34, 0.5);

  opacity: 1;

}



.works .item .details {

  padding: 20px;

}



.works .item .details i {

  color: #f21e4e;

}



/* ------------------------------

		Testimonials

------------------------------ */

.testimonials .owl-carousel {

  width: 100%;

  margin-bottom: 30px;

}



.testimonials .item {

  max-width: 750px;

}



.testimonials .item .image {

  position: relative;

  z-index: 1;

}



.testimonials .item .image img {

  width: 80px;

  height: 80px;

  max-width: 100px;

  border-radius: 50%;

  z-index: 1;

}



.testimonials .item .image:after {

  position: absolute;

  content: "";

  left: -5px;

  top: -5px;

  width: 90px;

  height: 90px;

  border: 1px solid #f21e4e;

  z-index: -1;

  border-radius: 50%;

  background-color: #ffffff;

}



.testimonials .item .content {

  padding: 30px;

  padding-left: 70px;

  margin-left: -40px;

  z-index: -1;

  background-color: #f8f9fa;

  border-radius: 5px;

}



.testimonials .item .content .icon {

  font-size: 30px;

  color: #f21e4e;

}



.testimonials .item .content .author {

  position: relative;

  padding-left: 10px;

}



.testimonials .item .content .author:after {

  position: absolute;

  content: "";

  left: 0px;

  top: 2px;

  width: 3px;

  height: 20px;

  background-color: #f21e4e;

}



.testimonials .item .content .author .dot {

  margin: 2px 10px;

  width: 5px;

  height: 5px;

  border-radius: 50%;

  background-color: #929292;

  display: -webkit-inline-box;

  display: -ms-inline-flexbox;

  display: inline-flex;

}



.testimonials .owl-dots {

  text-align: center;

}



.testimonials .owl-dot span {

  display: block;

  width: 10px;

  height: 10px;

  background-color: #eee;

  margin: 0 6px;

  border-radius: 50%;

  -webkit-transition: all 0.5s ease;

  transition: all 0.5s ease;

}



.testimonials .owl-dot.active span {

  background-color: #f21e4e;

}



.testimonials .owl-stage-outer {

  padding-bottom: 30px;

}



/* ---------------------------------

		Blog 

--------------------------------- */

.blog .item {

  position: relative;

  margin-bottom: 30px;

  -webkit-transition: all 0.5s ease;

  transition: all 0.5s ease;

}



.blog .item:hover {

  -webkit-transform: translateY(-10px);

          transform: translateY(-10px);

}



.blog .item .content {

  position: relative;

  margin: -50px 20px auto 20px;

  padding: 20px;

  border-radius: 5px;

  background-color: #ffffff;

  -webkit-box-shadow: 0px 5px 20px 0px rgba(69, 67, 96, 0.1);

          box-shadow: 0px 5px 20px 0px rgba(69, 67, 96, 0.1);

}



.blog .item .content small {

  position: relative;

}



.blog .item .content small:after {

  position: absolute;

  content: "";

  left: -20px;

  top: -4px;

  width: 3px;

  height: 26px;

  background-color: #f21e4e;

}



.blog .item .content small .dot {

  margin: 2px 10px;

  width: 5px;

  height: 5px;

  border-radius: 50%;

  background-color: #929292;

  display: -webkit-inline-box;

  display: -ms-inline-flexbox;

  display: inline-flex;

}



.blog .item .content h5 {

  text-transform: capitalize;

  line-height: 1.2;

}



/* ------------------------------

		Contact 

------------------------------ */

.contact ::-moz-placeholder {

  color: #343a40 !important;

}



.contact .contact-info .item .fa-phone {

  -webkit-transform: rotate(90deg);

          transform: rotate(90deg);

}



.contact .contact-info .item i {

  margin-right: 10px;

  font-size: 14px;

}



.form {

  padding: 30px;

  position: relative;

  z-index: 1;

  margin-bottom: 30px;

  background-color: #f8f9fa;

  border-radius: 5px;

}



.form .form-group {

  margin-bottom: 20px;

}



.form .form-control {

  background-color: transparent;

  border: none;

  border: 1px solid #eee;

  border-radius: 5px;

  padding: 10px;

  font-size: 16px;

  color: #343a40;

  display: inline-block;

  -webkit-transition: all 0.3s ease;

  transition: all 0.3s ease;

}



.form .form-control:focus {

  border: 1px solid #f21e4e;

  -webkit-box-shadow: none;

          box-shadow: none;

}



.form .form-control ::-moz-placeholder {

  color: #343a40 !important;

}



/* -----------------------------

		 Preloader 

--------------------------------- */

.loading {

  position: fixed;

  top: 0;

  left: 0;

  height: 100%;

  width: 100%;

  background-color: #ffffff;

  z-index: 99999;

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: center;

      -ms-flex-align: center;

          align-items: center;

  -webkit-box-pack: center;

      -ms-flex-pack: center;

          justify-content: center;

}



.loading .circle {

  margin: auto;

  width: 40px;

  height: 40px;

  border-radius: 50%;

  background-color: #12a89d;

  -webkit-animation: load 0.9s infinite linear;

          animation: load 0.9s infinite linear;

}



@-webkit-keyframes load {

  0% {

    -webkit-transform: scale(0.5);

            transform: scale(0.5);

  }

  50% {

    -webkit-transform: scale(1.2);

            transform: scale(1.2);

  }

  100% {

    -webkit-transform: scale(0);

            transform: scale(0);

  }

}



@keyframes load {

  0% {

    -webkit-transform: scale(0.5);

            transform: scale(0.5);

  }

  50% {

    -webkit-transform: scale(1.2);

            transform: scale(1.2);

  }

  100% {

    -webkit-transform: scale(0);

            transform: scale(0);

  }

}



@media screen and (max-width: 991px) {

  .about .hero,

  .contact .contact-info {

    margin-bottom: 30px;

  }

}



@media screen and (max-width: 768px) {

  .header-left {

    -webkit-transform: translateX(-100px);

            transform: translateX(-100px);

			display:none;

  }

  .header-left .logo,

  .header-left .btn-share {

    display: none;

  }

  .header-left .main-menu {

    height: 100%;

    width: 100%;

	display:none;

   

  }

  .header-left .main-menu .cross {

    display: block;

  }

  .header-left .main-menu .menu-nav {

    -webkit-box-orient: vertical;

    -webkit-box-direction: normal;

        -ms-flex-direction: column;

            flex-direction: column;

    height: 100%;

    -webkit-box-pack: center;

        -ms-flex-pack: center;

            justify-content: center;

    -webkit-box-align: center;

        -ms-flex-align: center;

            align-items: center;

  }

  .header-left .main-menu .menu-nav .nav-link {

    padding: 15px 0;

    line-height: 1.5;

  }

  .header-left .main-menu .menu-nav .nav-link.active:after, .header-left .main-menu .menu-nav .nav-link:hover:after {

    bottom: 0;

  }

  .social-footer {

    display: none !important;

  }

  .main {

    margin-left: 0;

  }

  .menu-toggle {

    display: none;

  }

}



@media screen and (max-width: 567px) {

  h1 {

    font-size: 32px;

  }

  h2 {

    font-size: 28px;

	margin-top:60px;

  }

  .max-width-450 {

    width: auto;

  }

  .section {

    padding-left: 0;

    padding-right: 0;

  }

  .home {

    padding: 0;

    background-position: unset !important;

  }

  .home .banner h1.cd-headline {

    font-size: 32px;

  }

  .p25 {

    padding: 5px 5px 5px 5px !important;

}

  .my-info {

    display: block;

  }

  .about .details .info li {

    width: 100%;

  }

  .testimonials .item .content .data {

    -webkit-box-orient: vertical;

    -webkit-box-direction: normal;

        -ms-flex-direction: column;

            flex-direction: column;

  }

}