body {
  font-family: "Roboto";
}

button:focus {
  outline: 0;
}

button:hover {
  background-color: #3d6fc2;
}

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

  .desktop,
  .tablet {
    display: none;
  }

  .mobileDesktop {
    display: block;
  }

  .mobile,
  .mobileTablet {
    display: block;
  }

  .desktopOnly {
    display: none;
  }

  .desktopTablet {
    display: none;
  }

  .footerTablet {
    display: none;
  }
}

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

  .desktop,
  .tablet {
    display: block !important;
  }

  .mobileDesktop {
    display: none;
  }

  .mobile {
    display: none;
  }

  .desktopTablet {
    display: flex;
  }

  .footerTablet {
    display: block;
  }

  .carousel-inner {
    min-height: 400px;
  }
}

@media screen and (min-width: 1024px) {
  .desktopOnly {
    display: block;
  }

  .mobileDesktop {
    display: block;
  }

  .footerTablet {
    display: none;
  }

  .tablet,
  .mobileTablet {
    display: none !important;
  }
}

.video {
  overflow: hidden;
  background-size: cover;
  width: 100%;
  height: 100%;
  position: relative;
}

.video video {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.video .overlay {
  background: url(/assets/images/videoOverlay.png);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

.nav-link {
  color: #fff !important;
  text-transform: uppercase;
}

.footer .websiteContentFooter>a:hover {
  color: #007bff !important;
}

body {
  font-family: "Roboto";
}

img {
  max-width: 100%;
}

.websiteNumbers {
  background-color: #2e2e2e;
}

.websiteNumbersImage {
  margin: 4rem;
}

.websiteNumbersContent h2 {
  font-size: 3rem;
  font-weight: bold;
  margin-bottom: 0;
}

.websiteNumbersContent p {
  font-size: 1rem;
}

.websiteServicesImage {
  margin: 4rem;
  position: sticky;
  top: 2rem;
}

.all_servicesLink {
  color: #000000;
  font-size: 2rem;
  font-weight: bold;
  border-bottom: 3px solid #4285f4;
}

.all_servicesLink:hover {
  text-decoration: none;
  color: #4285f4;
}

.websiteWork a:not(.workImgs) {
  border-bottom: 2px solid #4285f4;
  border-width: thick;
  color: #ffffff;
  font-size: 1.7rem;
}

.websiteWork a:not(.workImgs):hover {
  text-decoration: none;
  color: #4285f4;
}

.projectsImages {
  position: absolute;
  left: 15%;
  top: 6%;
}

.haveAnIdea {
  position: relative;
  height: 250px;
  background: #2e2e2e;
}

.haveAnIdea img {
  display: none;
}

.haveAnIdea>h2 {
  color: #ffffff;
  position: absolute;
  top: 15%;
  left: 20%;
}

.haveAnIdea>button {
  background-color: #4285f4;
  border: 1px solid #4285f4;
  color: #ffffff;
  position: absolute;
  top: 35%;
  left: 20%;
  font-size: 1.5rem;
  padding: 0.5rem 2rem;
}

.NewsLetter {
  position: relative;
}

.NewsLetter>.newsLetterHeader1 {
  color: #ffffff;
  font-size: 2.5rem;
  font-weight: 300;
  position: absolute;
  top: 30%;
  left: 25%;
}

.NewsLetter>.newsLetterHeader2 {
  color: #ffffff;
  font-size: 2.5rem;
  font-weight: 700;
  position: absolute;
  top: 45%;
  left: 25%;
}

.NewsLetter>.newsletterForm {
  position: absolute;
  top: 75%;
  left: 25%;
}

form.newsletterForm input[type=text] {
  padding: 0.5rem 2.5rem 0.5rem 1.5rem;
  font-size: 1.1rem;
  border: 1px solid grey;
  float: left;
  width: 70%;
  background: #f1f1f1;
}

form.newsletterForm input[type=email] {
  padding: 0.5rem 2.5rem 0.5rem 1.5rem;
  font-size: 1.1rem;
  border: 1px solid grey;
  float: left;
  width: 70%;
  background: #f1f1f1;
}

form.newsletterForm button {
  float: left;
  width: 30%;
  padding: 0.5rem 2rem;
  background: #4285f4;
  color: #ffffff;
  font-size: 1.1rem;
  border: 1px solid grey;
  border-left: none;
  cursor: pointer;
}

form.newsletterForm button:hover {
  background: #0b7dda;
}

.getInTouchImage {
  margin: 4rem;
}

.getInTouchForm input,
.getInTouchForm textarea {
  border: 1px solid #696969;
  color: #696969;
  width: 100%;
}

.getInTouchForm textarea {
  width: 100%;
}

.msgInput {
  padding-bottom: 4.2rem !important;
}

@media screen and (min-width: 320px) {
  .desktop {
    display: none;
  }

  .mobileTablet {
    display: block;
  }

  .mainBgMobile {
    background-color: #ffffff;
  }

  .mainContentMobile {
    color: #2e2e2e;
    padding-top: 2rem;
    padding-left: 1rem;
  }

  .carousel-caption {
    top: 0%;
    left: 8%;
    color: #000 !important;
  }

  .carousel-caption h1 {
    font-size: 24px;
  }

  .mainImage-button,
  .mainImage-button-center {
    background: #4285f4;
    border: 1px solid #4285f4;
    border-radius: 3px;
    color: #ffffff;
    font-size: 1.2rem;
    padding: 0.2rem 2rem;
    margin-top: 1.5rem;
  }

  .mainContentMobile .mainDesc {
    padding-top: 1rem;
  }

  .startProBtnMobile {
    background: transparent;
    border: 2px solid #4285f4;
    color: #ffffff;
    font-size: 1rem;
    padding: 0.5rem 2rem;
    margin-top: 1rem;
    margin-bottom: 2rem;
  }

  .startProBtnMobile:focus {
    outline: 0;
  }

  .startProBtnMobile:hover {
    background: #4285f4;
  }

  .websiteDesktop {
    display: none;
  }

  .websiteNumbersImage {
    display: none;
  }

  .websiteNumbersMobile {
    color: #ffffff;
    font-size: 1.7rem;
  }

  .websiteNumbersMobile p {
    padding-left: 2rem;
    font-weight: bold;
  }

  .firstWebsiteNumbersContent h2,
  .firstWebsiteNumbersContent p {
    border-left: 0;
  }

  .lastWebsiteNumbersContent h2,
  .lastWebsiteNumbersContent p {
    border-right: 0;
  }

  .websiteNumbersContent {
    padding-top: 0;
    color: #ffffff;
    text-align: center;
  }

  .websiteNumbersContent h2 {
    font-size: 2rem;
    font-weight: bold;
    margin-bottom: 0;
    margin-top: 0.5rem;
  }

  .websiteNumbersContent p {
    margin-top: 1rem;
    font-weight: bold;
  }

  .spacing {
    display: none;
  }

  .secondWebsitenumbers {
    padding-top: 0;
  }

  .lastWebsiteNumbersContent {
    margin-bottom: 2rem;
  }

  .websiteServicesMobile,
  .websiteClientsMobile {
    color: #000000;
    font-size: 1.7rem;
  }

  .websiteServicesMobile bold,
  .websiteClientsMobile bold {
    font-weight: bold;
  }

  .addPadding {
    padding-right: 15px;
  }

  .servicesImages img {
    padding-top: 2rem;
  }

  .servicesTopContentText,
  .servicesContentText {
    padding-top: 0;
    text-align: left;
  }

  .all_services {
    text-align: center;
  }

  .websiteWorkImage {
    display: none;
  }

  .websiteWorkTablet {
    display: none;
  }

  .websiteWorkMobileContent {
    background-color: #2e2e2e;
  }

  .websiteWorkMobile {
    color: #ffffff;
    font-size: 1.7rem;
    padding-left: 1rem;
  }

  .websiteWorkMobile bold {
    font-weight: bold;
  }

  .ourWorkImages {
    padding: 1rem;
  }

  .ourWorkImages img {
    padding-top: 1.5rem;
  }

  .all_projects {
    text-align: center;
  }

  .all_projects a {
    border-bottom: 3px solid #4285f4;
    color: #ffffff;
    font-size: 2rem;
    font-weight: bold;
  }

  .all_projects a:hover {
    color: #4285f4;
    text-decoration: none;
  }

  hr {
    background-color: #4285f4;
  }

  .haveAnIdeaMobile {
    background-color: #2e2e2e;
    color: #ffffff;
  }

  .haveAnIdeaTablet {
    display: none;
  }

  .haveAnIdeaContent bold {
    font-weight: bold;
  }

  .startProjectBtnMob {
    text-align: center;
    padding: 2.5rem 0;
  }

  .startProject {
    background-color: #4285f4;
    border: 0;
    color: #ffffff;
    font-size: 1.3rem;
    text-align: center;
    padding: 0.5rem 1rem;
  }

  .ourClientsDesktop {
    display: none;
  }

  .websiteClientsTablet {
    display: none;
  }

  .clientsDesktop {
    display: none;
  }

  .newsLetter {
    background-color: #2e2e2e;
  }

  .NewsLetterTablet {
    display: none;
  }

  .newsLetter h4 {
    color: #ffffff;
    padding: 3rem 3rem 1rem 3rem;
  }

  .newsLetter .newsletterFormMobile {
    padding: 1rem 1rem 3rem 1rem;
  }

  .newsletterFormMobile input {
    float: left;
    padding: 0.2rem 0.2rem 0.2rem 0.5rem;
  }

  .newsletterFormMobile button {
    padding: 0.2rem 0.5rem;
    background: #4285f4;
    color: #ffffff;
    font-size: 1.1rem;
    border: 1px solid grey;
    border-left: none;
  }

  .getInTouchMobileImg {
    font-size: 1.7rem;
  }

  .getInTouchMobile {
    display: block;
  }

  .inTouchFirstRow {
    margin-top: 0 !important;
  }

  .intouchLink {
    color: #4285f4;
  }
}

@media screen and (min-width: 768px) {
  .haveAnIdea>h2 {
    color: #ffffff;
    position: absolute;
    top: 15%;
    left: 15%;
  }

  .haveAnIdea>button {
    background-color: #4285f4;
    border: 1px solid #4285f4;
    color: #ffffff;
    position: absolute;
    top: 56%;
    left: 27%;
    font-size: 1.5rem;
    padding: 0.5rem 2rem;
  }

  .desktop {
    display: block;
  }

  .mobile {
    display: none;
  }

  .carousel-images img {
    height: 400px;
  }

  .swiper-slide>img {
    height: 300px !important;
  }

  .mainContentText {
    padding: 2rem;
  }

  .top-left {
    color: #2e2e2e;
    font-size: 1.5rem !important;
    padding-top: 1rem;
  }

  .website-name {
    color: #2e2e2e;
    font-size: 0.9rem !important;
  }

  .website-link,
  .website-link-bottom,
  .website-desc-bottom {
    color: #2e2e2e;
    font-size: 1rem !important;
    font-weight: 300;
  }

  .top-center {
    color: #2e2e2e;
    font-size: 1rem !important;
    font-weight: 300;
    padding-top: 0;
    width: 50% !important;
  }

  .bottom-center {
    color: #2e2e2e;
    font-size: 0.95rem !important;
    font-weight: 300;
    width: fit-content;
  }

  .mainImage-button,
  .mainImage-button-center {
    font-size: 1rem;
    padding: 0.5rem 4.3rem;
    margin-top: 0rem;
  }

  .bottom {
    color: #2e2e2e;
    font-size: 1rem !important;
    font-weight: 300;
    width: fit-content;
  }

  .websiteNumbersContent {
    padding-top: 5rem;
  }

  .websiteNumbersContent h2 {
    font-size: 3rem;
    margin-top: 0;
  }

  .websiteNumbersContent p {
    margin-top: 0;
    font-weight: 500;
  }

  .secondWebsitenumbers {
    padding-top: 1rem;
  }

  .lastWebsiteNumbersContent {
    margin-bottom: 0;
  }

  .addPadding {
    padding-right: 0;
  }

  .servicesTopContentText {
    padding-top: 7rem;
    padding-left: 0;
  }

  .servicesContentText {
    padding-top: 5rem;
    padding-left: 0;
  }

  .all_services {
    text-align: start;
  }

  .websiteWorkTablet {
    background-color: #2e2e2e;
  }

  .websiteWorkImage {
    display: none;
  }

  .mobileTablet .ourWorkDetails {
    margin-top: 2rem;
  }

  .photoGrid {
    padding-right: 3rem;
    padding-left: 3rem;
  }

  .ourWorkText {
    padding: 2rem;
  }

  .websiteWorkTablet {
    display: block;
  }

  .websiteWorkTablet span {
    border-bottom: 2px solid #4285f4;
    border-width: thick;
    color: #ffffff;
    font-size: 1.7rem;
  }

  .haveAnIdeaTablet,
  .NewsLetterTablet {
    background-color: #2e2e2e;
    color: #ffffff;
    padding: 3rem;
    text-align: center;
  }

  .NewsLetterTablet {
    display: block;
    padding: 5rem;
  }

  .haveAnIdeaTablet>button {
    background-color: #4285f4;
    color: #ffffff;
    border: 1px solid #4285f4;
    font-size: 1.5rem;
    padding: 0.5rem 2rem;
    margin-top: 1rem;
  }

  .clientsDesktop {
    display: flex;
  }

  .websiteClientsTablet {
    display: block;
  }

  .getInTouchMobile,
  .getInTouchImage {
    display: none;
  }

  .inTouchFirstRow {
    margin-top: 3rem !important;
  }

  .carousel-home {
    display: none;
  }

  .carousel-caption {
    left: 5%;
    top: 1%;
  }
}

@media screen and (min-width: 1024px) {
  .haveAnIdea {
    height: auto;
  }

  .haveAnIdea img {
    display: block;
  }

  .haveAnIdea>h2 {
    color: #ffffff;
    position: absolute;
    top: 15%;
    left: 25%;
  }

  .haveAnIdea>button {
    background-color: #4285f4;
    border: 1px solid #4285f4;
    color: #ffffff;
    position: absolute;
    top: 36%;
    left: 23%;
    font-size: 1.5rem;
    padding: 0.5rem 2rem;
  }

  .mobileTablet {
    display: none;
  }

  #myHeader {
    padding-left: 5rem;
    padding-right: 5rem;
  }

  .navbar-nav a {
    font-size: 1.1rem;
  }

  .navbar-nav a:hover {
    border-bottom: 2px solid #4285f4;
  }

  .intouch {
    background-color: #4285f4;
  }

  .intouch:hover {
    background-color: #3d6fc2;
  }

  /* Make the image fully responsive */
  .carousel-images img {
    width: 100%;
    height: 410px;
    position: relative;
  }

  .swiper-slide>img {
    height: 450px !important;
  }

  .carousel-caption {
    left: 5%;
    top: 1%;
  }

  .mainContentText {
    padding: 7rem 4rem;
  }

  .top-left {
    padding-top: 0;
  }

  .website-name {
    font-weight: 300;
    font-size: 1.3rem !important;
    padding-top: 1rem;
  }

  .addpluses {
    font-size: 2rem !important;
  }

  .website-link,
  .website-link-bottom {
    font-size: 1.5rem !important;
    font-weight: 300;
    padding-top: 1.5rem;
  }

  .website-desc-bottom {
    font-size: 1.5rem !important;
    font-weight: 300;
  }

  .top-center {
    color: #2e2e2e;
    font-size: 1.3rem !important;
    font-weight: 300;
    padding-left: 0;
    padding-top: 1rem;
    width: 50%;
    word-break: break-word;
  }

  .bottom-center {
    font-size: 1.3rem !important;
    padding-left: 0;
    padding-top: 1rem;
  }

  .mainImage-button,
  .mainImage-button-center {
    font-size: 1.5rem;
    margin-top: 0.3rem !important;
  }

  .bottom {
    font-size: 1.3rem !important;
    padding-left: 0;
  }

  .mainImage-button {
    margin-left: 0;
    margin-top: 1.2rem;
  }

  .mainImage-button-center {
    margin-left: 5rem;
    margin-top: 2rem;
  }

  .websiteNumbersImage {
    display: block;
  }

  .websiteDesktop {
    display: flex;
  }

  .spacing {
    display: block;
  }

  .firstWebsiteNumbersContent h2,
  .firstWebsiteNumbersContent p {
    border-left: 6px solid #4285f4;
  }

  .lastWebsiteNumbersContent h2,
  .lastWebsiteNumbersContent p {
    border-right: 6px solid #4285f4;
  }

  .websiteWorkImage {
    display: block;
    margin: 4rem;
    position: sticky;
    top: 2rem;
  }

  .websiteWork {
    background-image: url("/assets/images/ourWorkBg.png");
    height: 1224px;
    background-color: #2e2e2e;
    background-repeat: no-repeat;
  }

  .workImgs img {
    opacity: 1;
    transition: 0.5s ease;
  }

  .workImgs:hover img {
    opacity: 0.3;
  }

  .photoGrid {
    padding-right: 5rem;
  }

  .ourWorkText {
    padding: 5rem;
  }

  .haveAnIdeaTablet {
    display: none;
  }

  .NewsLetterTablet {
    display: none;
  }

  .ourClientsDesktop {
    display: block;
    position: sticky;
    top: 2rem;
  }

  .websiteClientsTablet {
    display: none;
  }

  .getInTouchMobile {
    display: none;
  }

  .getInTouchImage {
    display: block;
  }
}

@media screen and (min-width: 1152px) {
  .swiper-slide>img {
    height: auto !important;
  }
}

@media screen and (min-width: 1200px) {
  .haveAnIdea>h2 {
    color: #ffffff;
    position: absolute;
    top: 15%;
    left: 20%;
  }

  .haveAnIdea>button {
    background-color: #4285f4;
    border: 1px solid #4285f4;
    color: #ffffff;
    position: absolute;
    top: 35%;
    left: 19%;
    font-size: 1.5rem;
    padding: 0.5rem 2rem;
  }

  .carousel-images img {
    height: auto;
  }
}

.hideInDesktop {
  display: none;
}

@media screen and (max-width: 1024px) {
  .hideInDesktop {
    display: block !important;
  }
}

.ourClients {
  padding: 25px 0;
}

.nav-link {
  color: #fff;
}

.header-img-mob {
  position: absolute;
  bottom: 10%;
}

/*# sourceMappingURL=home.css.map */