/*
    FONT STYLE
*/
@font-face {
  font-family: "Cera Pro";
  src: local("Cera Pro Regular"), local("Cera-Pro-Regular"), 
   url("/assets/fonts/Cera\ Pro\ Bold.otf") format("OpenType")
   ;
}
@font-face {
  font-family: 'CeraPro';
  src: url('CeraPro.eot?#iefix') format('embedded-opentype'),
       url('../fonts/cera/Cera\ Pro\ Light.otf') format('OpenType'), 
       url('/assets/fonts/cera/Cera\ Pro\ Bold.otf') format('OpenType'), 
       url('../fonts/cera/Cera\ Pro\ Medium.otf') format('OpenType'), 
       url('../fonts/cera/Cera\ Pro\ Regular\ Italic.otf') format('OpenType'); 
}

html {
  height: 100%;
}

body {
  margin: 0;
  padding: 0;
  height: 100%;
  overflow-x: hidden;
  font-weight: normal;
  font-family: "Cera Pro ";
  
 
}
input{
  font-family: "Cera Pro";
}
a {
  text-decoration: none !important;
}
button {
  outline:none !important; 
  box-shadow: none !important;
  border: none!important;
  text-decoration: none !important;
  font-family: "Cera Pro";

}
span {
  font-family: "CeraPro";
  color: #222326;
  font-style: normal;
}
p {
  font-family: "CeraPro";
  font-size: 18px;
  color: #222326;
  font-style: normal;
}
h1 {
  font-family: "Cera Pro";
  letter-spacing: 1px;
  color: #222326;
  font-weight: bold;
  font-size: 40px;
}
 h2 {
  font-family: "Cera Pro";
  letter-spacing: 1px;
  color: #222326;
}
h3 {
  font-family: "Cera Pro";
  letter-spacing: 1px;
  color: #222326;
}
h4 {
  font-family: "Cera Pro";
  letter-spacing: 1px;
  color: #222326;
}
 h5 {
  font-family: "Cera Pro";
  letter-spacing: 1px;
  color: #222326;
}
h6 {
  font-family: "Cera Pro";
  letter-spacing: 1px;
  color: #222326;
}
a{

  text-decoration: none !important;
}
a:hover{
  color: #0F98BC;
}
u{

    color: rgba(66, 39, 90, 0.38); 
}
/* header  */
li.nav-item {

  font-family: "Cera Pro";
  display: flex;
  flex-direction: column;
  justify-content: center;
}
/* main banner section */

.main-banner {
  padding-top: 100px;
}
.banner-text h3 {
  padding-top: 40px;
}
.banner-text h1 {
  padding-top: 30px;
}
button.contact-us.blue-button.cc {
  margin-top: 32px;
}
a.contact-us-btn {
  color: white !important ;
}
button.contact-us {
  
  width: 200px;
  height: 45px;
  right: 190px;
  color: white !important ;
  border-radius: 100px;
  background: linear-gradient(180deg, #0F98BC 0%, rgba(15, 152, 188, 0.79) 100%);

}
button.contact-us.blue-button {
  border: none!important;
}
.pointer{
  cursor: pointer;
}
.card {
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.3) !important;
  border-radius: 20px;
  height: 100%;
  margin-bottom: 2%;
}
.black{
  color: #222326;
}
.brown{
color: #000000;
font-size: 16px;
opacity: 0.5;
} 
.card-img-top {
  width: 100%;
}
.card-img-top.cc {
  width: 100%;
  border-top-left-radius: calc(1.25rem - 1px);
  border-top-right-radius: calc(1.25rem - 1px);
}

/* services section */
.services-section{
  padding-top: 170px;
}
.blue{
  color: #0F98BC;
}
.flex-center-col{
  
    display: flex;
    flex-direction: column;
    align-items: center;

}
.services p {
  margin: 10px 93px;
  text-align: center;
}
.card-one{
  padding-top: 100px;
  text-align: center;
}
.card-two{
  padding-top: 38px;
  text-align: center;
}
.card-three{
  padding-top: 65px;
  text-align: center;
}
.card-one-text h4 {
  padding-top: 21px;
}.card-two-text h4 {
  padding-top: 16px;
}

/* tech section */
.tech-section{
  padding-top: 170px;
}
.tech p {
  margin: 10px 173px;
  text-align: center;
}
.tech-1st-row{
  padding-top: 5rem;
}
.tech-text{    display: flex;
  flex-direction: column;
  justify-content: center;
}
.tech-img{
  text-align: center;
  padding-top: 3%;
  padding-bottom: 3%;
}
span.bold {
  font-weight: bolder;
}
.tech-row{
  padding-top: 2rem;
}
/* blog section */
.card-general{

  padding-top: 100px;
}
/* schedule section */
.form-control{
  font-family: "care pro";
  border: none!important;  
  box-shadow: none !important;
  border-bottom: 2px solid #dadada!important;
  padding-top: 2rem;
  outline: none;

}
.general-padding{
  padding: 0% 35% 10% 0%;
}
.general-right{
  display: flex;
    flex-direction: column;
    align-items: flex-end;
}
.media-img{
  padding-left: 1.5rem;

}
.media{

  padding-top: 9%;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
}
/* footer */
.footer-media{

  display: flex;
  flex-direction: row;
  justify-content: flex-end;
}
.gray{
  color: #BDBDBD
}
#page-container {
  position: relative;
  min-height: 100vh;
}

#content-wrap {
  padding-bottom: 2.5rem;    /* Footer height */
}

#footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 2.5rem;            /* Footer height */
}

/* estimate */
.general-padding-form {
  padding: 0% 28% 0% 29%;
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */

  font-family: "CeraPro" !important;
  font-size: 18px !important;
}
::-moz-placeholder { /* Firefox 19+ */
  font-family: "CeraPro" !important;
  font-size: 18px !important;
}
:-ms-input-placeholder { /* IE 10+ */
  font-family: "CeraPro" !important;
  font-size: 18px !important;
}
:-moz-placeholder { /* Firefox 18- */
  font-family: "CeraPro" !important;
  font-size: 18px !important;
}


/* 
mediaa query */
@media only screen and (min-width : 320px) and (max-width : 480px) {
  .main-banner {
    padding-top: 0;
}
  .banner-image img {
    padding-top: 30px;
    width: 100%;
    height: 30%;
}
.banner-text h3 {
  font-size: 22px;
  padding-top: 10px;
}
.banner-text h1 {
  font-size: 22px;
  padding-top: 10px;
}
/* services */
.services-section {
  padding-top: 50px;
}
.services p {
  margin: 0;
}

/* tech */
.tech-section {
  padding-top: 50px;
}
.tech p {
  margin: 0;
}
/* schedule */
.general-padding {
  padding:  0%;
}
.general-right {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 5%;
}
.media {
  display: flex;
  flex-direction: row;
  justify-content: center;
}
.media-img {
  padding-left: 1rem;
}
/* footer */
.footer{
  text-align: center;
}
.footer-media {
  display: flex;
  flex-direction: row;
  justify-content: center;
}

/* estimate */
h1 {
  font-size: 22px;
}
h3 {
  font-size: 19px;
}
h4 {
  font-size: 18px;
}
.general-padding-form {
  padding: 0;
}
}


@media only screen and (min-width : 481px) and (max-width : 768px) {
  .main-banner {
    padding-top: 0;
}
  .banner-image img {
    padding-top: 30px;
    width: 100%;
    height: 30%;
}
.banner-text h3 {
  font-size: 22px;
  padding-top: 10px;
}
.banner-text h1 {
  font-size: 22px;
  padding-top: 10px;
}
/* services */
.services-section {
  padding-top: 50px;
}
.services p {
  margin: 0;
}
/* tech */
.tech-section {
  padding-top: 50px;
}
.tech p {
  margin: 0;
}
/* schedule */
.general-padding {
  padding:  0%;
}
/* .general-right {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 5%;
} */
.media {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
}
.media-img {
  padding-left: 1rem;
}
/* footer */
.footer{
  text-align: center;
}
.footer-media {
  display: flex;
  flex-direction: row;
  justify-content: center;
}
/* estimate */
h1 {
  font-size: 22px;
}
h3 {
  font-size: 19px;
}
h4 {
  font-size: 18px;
}

}


@media only screen and (min-width : 768px) and (max-width : 1024px) {
  .banner-text h3 {
    font-size: 25px;
    padding-top: 30px;
}
.banner-text h1 {
  font-size: 30px;
  padding-top: 30px;
}
.card-one{
  width: 14rem !important;
  padding-top: 93px;
}
.card-two{
  width: 14rem !important;
  padding-top: 45px;
}
.card-three{
  width: 14rem !important;
}
.card-general{

  width: 14rem !important;
}

  }


  @media only screen and (min-width : 1024px) and (max-width : 1366px) {
    .banner-image img {
      width: 100%;
      height: 30%;
  }
          }