body { font-family: 'Noto Sans', sans-serif !important;  color: #272829;}
a { color: #0563bb;}
a:hover { color: #067ded;  text-decoration: none;}

/*--------------------------------------------------------------
# Back to top button
--------------------------------------------------------------*/
.back-to-top { position: fixed;  display: none;  width: 40px;  height: 40px;  border-radius: 50px;  right: 15px;  bottom: 15px;  background: #0563bb;  color: #fff;  transition: display 0.5s ease-in-out;  z-index: 99999;}
.back-to-top i { font-size: 24px;  position: absolute;  top: 7px;  left: 8px;}
.back-to-top:hover { color: #fff;  background: #0678e3;  transition: background 0.2s ease-in-out;}

/*--------------------------------------------------------------
# Preloader
--------------------------------------------------------------*/
#preloader { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 9999; overflow: hidden; background: #fff;}
#preloader:before { content: ""; position: fixed; top: calc(50% - 30px); left: calc(50% - 30px); border: 6px solid #0563bb; border-top-color: #fff; border-bottom-color: #fff; border-radius: 50%; width: 60px; height: 60px; -webkit-animation: animate-preloader 1s linear infinite; animation: animate-preloader 1s linear infinite; }

@-webkit-keyframes animate-preloader { 
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@keyframes animate-preloader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}



/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
#header { position: fixed; bottom: 0; z-index: 1; transition: all 0.5s; padding: 15px; overflow-y: auto;}

/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/
/* Desktop Navigation */
.nav-menu * { margin: 0; padding: 0; list-style: none;}
.nav-menu > ul > li { position: relative; white-space: nowrap;}
.nav-menu a i { font-size: 20px;}
.nav-menu a span { padding: 0 5px 0 7px; color: #45505b;}
.nav-menu a:hover, .nav-menu .active > a, .nav-menu span:hover > a { color: #fff;}
.nav-menu a:hover span, .nav-menu .active > a span, .nav-menu span:hover > a span {color: #fff;}
.nav-menu a:hover, .nav-menu span:hover > a { width: 100%; color: #fff;}
.nav-menu a:hover span, .nav-menu span:hover > a span { display: block;}

/* Mobile Navigation */
.mobile-nav-toggle { position: fixed; right: 15px; top: 15px; z-index: 9998; border: 0; background: none; font-size: 24px; transition: all 0.4s; outline: none !important; line-height: 1; cursor: pointer; text-align: right;}
.mobile-nav-toggle i { color: #45505b;}
.mobile-nav-active { overflow: hidden;}
.mobile-nav-active #header { left: 0;}
.mobile-nav-active .mobile-nav-toggle i { color: #0563bb;}
.icon-4x { font-size: 2em !important;}

/*--------------------------------------------------------------
# Hero Section
--------------------------------------------------------------*/
#hero { width: 100%; height: 100vh; background: url("../img/hero-bg.jpg") top right no-repeat; background-size: cover; position: relative;}
#hero > div.container.animated.aos-init.aos-animate > img { border-radius: 50%; width: 200px; transition: 0.5s;}
#hero:before { content: ""; background: rgba(255, 255, 255, 0.8); position: absolute; bottom: 0; top: 0; left: 0; right: 0;}
#hero h1 { margin: 0; font-size: 64px; font-weight: 700; line-height: 56px; color: #45505b;}
#hero p { color: #45505b; margin: 15px 0 0 0; font-size: 26px; font-family: "Poppins", sans-serif;}
#hero p span {color: #0563bb; letter-spacing: 1px;}
#hero .social-links { margin-top: 30px;}
#hero .social-links a { font-size: 24px; display: inline-block; color: #45505b; line-height: 1; margin-right: 20px; transition: 0.3s;}
#hero .social-links a:hover { color: #0563bb;}
#hero .animated { animation: up-down 2s ease-in-out infinite alternate-reverse both;}
#hero > div.container.animated.aos-init.aos-animate > img:hover { opacity:0!important; transition: 0.5s;}
@keyframes up-down {
  0% {
  transform: translateY(10px);
  }
  100% {
  transform: translateY(-10px);
  }
}
#hero .btn-get-started {font-size: 64px; transition: 0.5s; color: #fff; height: 60px; text-shadow: 3px 3px 15px black;}
#hero .btn-get-started:hover { padding-top: 10px; color: #d43076;}

/*--------------------------------------------------------------
# Sections General
--------------------------------------------------------------*/
section { padding: 60px 0; overflow: hidden;}
.section-title { text-align: center; padding-bottom: 30px;}
.section-title h2 { font-size: 32px; font-weight: bold; text-transform: uppercase; margin-bottom: 20px; padding-bottom: 20px; position: relative; color: #45505b;}
.section-title h2::before { content: ''; position: absolute; display: block; width: 120px; height: 1px; background: #ddd; bottom: 1px; left: calc(50% - 60px);}
.section-title h2::after { content: ''; position: absolute; display: block; width: 40px; height: 3px; background: #0563bb; bottom: 0; left: calc(50% - 20px);}
.section-title p { margin-bottom: 0;}

/*--------------------------------------------------------------
# About
--------------------------------------------------------------*/
hr { width:40% !important; margin-top: 0px !important; border-style: solid !important; border-top: 1px solid black !important; margin-bottom: 0; margin-left: 30%; margin-right: 30%;}

#resume > div > div:nth-child(2) > div:nth-child(1) > h3 { text-align: left;}
.about .content h3 { font-weight: 500; font-size: 34px; color: #2c4964;}
.about .content p { margin-bottom: 0;}
.about,.direction,.image { padding-bottom: 0;}

.bg-1 {background: url(../img/pc004179206_l.jpg) center no-repeat; background-size: cover; display: block; width: 100%; height: 681px; position: relative; margin: 0 auto; border-radius: 8px;}
#testimonials > div > div > div > div > div > div > div:nth-child(2) {  width: 100%;  top: 13%;  position: absolute;  display: block;  margin: 0 auto;  height: 100%; color: white;}
#testimonials > div > div > div.owl-stage-outer > div > div.owl-item.active > div > div:nth-child(2) > div:nth-child(1) > i.icofont-quote-left, 
#testimonials > div > div > div.owl-stage-outer > div > div.owl-item.active > div > div:nth-child(2) > div:nth-child(1) > i.icofont-quote-right {  font-size: 28px;  vertical-align: super;}
#testimonials > div > div > div.owl-stage-outer > div > div.owl-item.active > div > div:nth-child(2) > div:nth-child(1) > span {font-size: 60px;}
#testimonials > div > div > div.owl-stage-outer > div > div.owl-item.active > div > div.what > div:nth-child(2), 
#testimonials > div > div > div.owl-stage-outer > div > div.owl-item.active > div > div.what > div:nth-child(3) {font-size: 20px; text-align: center;}
#testimonials > div > div > div.owl-stage-outer > div > div.owl-item.active > div > ul {list-style: none; display: inline-flex;}

#testimonials > div > div > div.owl-stage-outer > div > div.owl-item.active > div {height: 681px; background: white; border-radius: 8px;}
#testimonials > div > div > div.owl-stage-outer > div > div.owl-item.active > div > div { font-size: 60px;  color: rgb(255, 253, 253);  padding-top: 30px;}
#testimonials > div > div > div.owl-stage-outer > div > div.owl-item.active > div > div > p {color: rgb(37, 36, 36); font-style: normal; margin-top: 47px;}
.storyPoint {position: relative; margin: 35px auto 35px auto; text-align: center;}
#testimonials > div > div > div.owl-stage-outer > div > div:nth-child(4) > div > ul {list-style: none;}
.point {height: 200px;margin: 10px 60px 10px 60px;overflow: hidden;font-size: 16px;color: rgb(58, 54, 54);-webkit-border-radius: 50%;-moz-border-radius: 20%;border-radius: 50%;width: 200px;border: 4px solid gray;position: relative;top: 47%;}
#testimonials > div > div > div.owl-stage-outer > div > div.owl-item.active > div > ul > li:nth-child(1) > div > div {font-size: 50px; top: 26%; position: relative ;}
#testimonials > div > div > div.owl-stage-outer > div > div.owl-item.active > div > ul > li.middle > div > div {font-size: 50px; top: 29%; position: relative ;}
#testimonials > div > div > div.owl-stage-outer > div > div.owl-item.active > div > ul > li:nth-child(3) > div > div {font-size: 50px; top: 29%; position: relative ;}
.bg-2 {background: url(../img/image.png) center no-repeat; background-color: rgba(255, 255, 255, 0.7); background-size: cover; display: block; width: 100%; height: 681px; position: relative; margin: 0 auto; border-radius: 8px;}
#testimonials > div > div > div.owl-stage-outer > div > div > div > div:nth-child(2) {background: rgb(0,0,0,0.5); margin: 0 100px 0 100px; height: 290px; padding-left: 20px;padding-right: 20px; width: 82%;}
#testimonials > div > div > div.owl-stage-outer > div > div > div > div:nth-child(2) > div:nth-child(1) {font-size: 50px; margin-bottom: 20px;}
#testimonials > div > div > div.owl-stage-outer > div > div > div > div:nth-child(2) > div:nth-child(2),
#testimonials > div > div > div.owl-stage-outer > div > div > div > div:nth-child(2) > div:nth-child(3),
#testimonials > div > div > div.owl-stage-outer > div > div > div > div:nth-child(2) > div:nth-child(4),
#testimonials > div > div > div.owl-stage-outer > div > div > div > div:nth-child(2) > div:nth-child(5),
#testimonials > div > div > div.owl-stage-outer > div > div > div > div:nth-child(2) > div:nth-child(6),
#testimonials > div > div > div.owl-stage-outer > div > div > div > div:nth-child(2) > div:nth-child(7) {font-size: 26px; text-align: left; margin: 28px;}
#testimonials > div > div > div.owl-stage-outer > div > div > div > div:nth-child(2) > div:nth-child(2) > span, 
#testimonials > div > div > div.owl-stage-outer > div > div > div > div:nth-child(2) > div:nth-child(3) > span,
#testimonials > div > div > div.owl-stage-outer > div > div > div > div:nth-child(2) > div:nth-child(4) > span,
#testimonials > div > div > div.owl-stage-outer > div > div > div > div:nth-child(2) > div:nth-child(5) > span,
#testimonials > div > div > div.owl-stage-outer > div > div > div > div:nth-child(2) > div:nth-child(6) > span,
#testimonials > div > div > div.owl-stage-outer > div > div > div > div:nth-child(2) > div:nth-child(7) > span { background: black; padding-left: 5px; padding-right: 3px; margin-right: 10px;}
.text-bg {height: 535px !important; background: rgb(255,255,255,0.8) !important;  color: black !important; border-radius: 40px;}
.text-bg > div > span {color : white}

#resume > div > div:nth-child(2) > div:nth-child(2) > div > div:nth-child(4) > div:nth-child(1) > div {margin-top: 20%;}
#resume > div > div:nth-child(2) > div:nth-child(2) > div > div > div:nth-child(1) > div,
#resume > div > div.row > div.col-lg-6 > div:nth-child(4) > div:nth-child(1) > div {margin-top: 21.5%; text-align: right;}
#resume > div > div:nth-child(3) > div.col-lg-6.text-center > div:nth-child(6) > div:nth-child(1) > div,
#resume > div > div:nth-child(3) > div.col-lg-6.text-center > div:nth-child(5) > div:nth-child(2) > div,
#resume > div > div:nth-child(2) > div:nth-child(2) > div > div:nth-child(3) > div:nth-child(2) > div,
#resume > div > div.row > div.col-lg-6 > div:nth-child(4) > div.row > div:nth-child(2) > div,
#resume > div > div:nth-child(2) > div:nth-child(1) > div > div:nth-child(2) > div {margin-top: 21%;}
#resume > div > div:nth-child(3) > div.col-lg-6.text-center > div:nth-child(6) > div:nth-child(1) > div > h5,
#resume > div > div:nth-child(3) > div.col-lg-6.text-center > div:nth-child(5) > div:nth-child(2) > div > h5,
#resume > div > div:nth-child(2) > div:nth-child(2) > div > div:nth-child(3) > div:nth-child(2) > div > h5,
#resume > div > div:nth-child(2) > div:nth-child(2) > div > div > div:nth-child(1) > div > h5,
#resume > div > div.row > div.col-lg-6 > div:nth-child(4) > div.row > div:nth-child(2) > div > h5,
#resume > div > div.row > div.col-lg-6 > div:nth-child(4) > div:nth-child(1) > div > h5,
#resume > div > div:nth-child(2) > div:nth-child(1) > div > div:nth-child(2) > div > h5 {border-bottom: 1px solid gray;}
#resume > div > div:nth-child(3) > div.col-lg-6.text-center > div:nth-child(6) > div:nth-child(1) > div > p,
#resume > div > div:nth-child(3) > div.col-lg-6.text-center > div:nth-child(5) > div:nth-child(2) > div > p,
#resume > div > div:nth-child(2) > div:nth-child(2) > div > div:nth-child(3) > div:nth-child(2) > div > p,
#resume > div > div:nth-child(2) > div:nth-child(2) > div > div > div:nth-child(1) > div > p,
#resume > div > div.row > div.col-lg-6 > div:nth-child(4) > div.row > div:nth-child(2) > div > p,
#resume > div > div.row > div.col-lg-6 > div:nth-child(4) > div:nth-child(1) > div > p,
#resume > div > div:nth-child(2) > div:nth-child(1) > div > div:nth-child(2) > div > p {font-size: 12px; word-break: keep-all;}
#resume > div > div:nth-child(3) > div.col-lg-6.text-center > div:nth-child(5) > div:nth-child(2) > div > h5,
#resume > div > div:nth-child(3) > div.col-lg-6.text-center > div:nth-child(5) > div:nth-child(2) > div > p {text-align: left;}
#resume > div > div:nth-child(3) > div.col-lg-6.text-center > div:nth-child(6) > div:nth-child(1) > div > h5,
#resume > div > div:nth-child(3) > div.col-lg-6.text-center > div:nth-child(6) > div:nth-child(1) > div > p {text-align: right;}
#portfolio {padding-bottom: 0 !important;}
.img01 {background: url(../img/images/mosaeRw5kw.jpeg) center no-repeat; height: 100%; height: 407px; border: 4px solid #fff;  border-radius: 8px;}
.img02 {background: url(../img/images/mosaWw2IfY.jpeg) center no-repeat; height: 100%; height: 407px; border: 4px solid #fff;  border-radius: 8px;}
.img03 {background: url(../img/images/[modo-phinf.pstatic.net][618]mosaP47A4B.jpeg) center no-repeat; height: 100%; height: 407px; border: 4px solid #fff;  border-radius: 8px;}
.img04 {background: url(../img/images/mosar0ENP6.jpeg) center no-repeat; height: 100%; height: 407px; border: 4px solid #fff;  border-radius: 8px;}
.img05 {background: url(../img/images/mosaN5Nee3.jpeg) center no-repeat; height: 100%; height: 407px; border: 4px solid #fff;  border-radius: 8px;}
.img06 {background: url(../img/images/[modo-phinf.pstatic.net][946]mosaKhikPd.jpeg) center no-repeat; height: 100%; height: 407px; border: 4px solid #fff;  border-radius: 8px;}
.img07 {background: url(../img/images/[modo-phinf.pstatic.net][605]mosaNrErFS.jpg) center no-repeat; height: 100%; height: 407px; border: 4px solid #fff;  border-radius: 8px;}
.img08 {background: url(../img/images/mosaMKdatD.jpeg) center no-repeat; height: 100%; height: 407px; border: 4px solid #fff;  border-radius: 8px;}
.img09 {background: url(../img/images/mosasaLNyp.jpeg) center no-repeat; height: 100%; height: 407px; border: 4px solid #fff;  border-radius: 8px;}
.img10 {background: url(../img/images/mosadlijMZ.jpeg) center no-repeat; height: 100%; height: 407px; border: 4px solid #fff;  border-radius: 8px;}
.img11 {background: url(../img/images/mosadKgbvo.jpeg) center no-repeat; height: 100%; height: 407px; border: 4px solid #fff;  border-radius: 8px;}
.img12 {background: url(../img/images/mosahpvlXL.jpeg) center no-repeat; height: 100%; height: 407px; border: 4px solid #fff;  border-radius: 8px;}
.img13 {background: url(../img/images/mosarf2kI0.jpeg) center no-repeat; height: 100%; height: 407px; border: 4px solid #fff;  border-radius: 8px;}
.img14 {background: url(../img/images/mosaJDHtoX.jpeg) center no-repeat; height: 100%; height: 407px; border: 4px solid #fff;  border-radius: 8px;}
.img15 {background: url(../img/images/mosaF4NLx4.jpeg) center no-repeat; height: 100%; height: 407px; border: 4px solid #fff;  border-radius: 8px;}
.img16 {background: url(../img/images/mosaRh0G9c.jpeg) center no-repeat; height: 100%; height: 407px; border: 4px solid #fff;  border-radius: 8px;}
.img17 {background: url(../img/images/mosarxgyFg.jpeg) center no-repeat; height: 100%; height: 407px; border: 4px solid #fff;  border-radius: 8px;}
.img18 {background: url(../img/images/mosaf9niJz.jpeg) center no-repeat; height: 100%; height: 407px; border: 4px solid #fff;  border-radius: 8px;}
.img19 {background: url(../img/images/mosaVspnfR.jpeg) center no-repeat; height: 100%; height: 407px; border: 4px solid #fff;  border-radius: 8px;}
.img20 {background: url(../img/images/mosaMWWXdQ.jpeg) center no-repeat; height: 100%; height: 407px; border: 4px solid #fff;  border-radius: 8px;}
.img21 {background: url(../img/images/mosaZMl7Q0.jpeg) center no-repeat; width: 540px; height: 407px; border: 4px solid #fff;  border-radius: 8px;}
.img22 {background: url(../img/images/mosaBrutfn.jpeg) center no-repeat; width: 540px; height: 407px; border: 4px solid #fff;  border-radius: 8px;}
.img23 {background: url(../img/images/mosa7zWQMT.jpeg) center no-repeat; width: 540px; height: 407px; border: 4px solid #fff;  border-radius: 8px;}
.img24 {background: url(../img/images/mosalR6Sis.jpeg) center no-repeat; width: 540px; height: 407px; border: 4px solid #fff;  border-radius: 8px;}

/*--------------------------------------------------------------
# Inquiry
--------------------------------------------------------------*/
.inquiry .inquiry-form { background: linear-gradient(to top, white, rgb(53, 221, 67), rgb(10, 82, 236)); margin: 60px 0; padding: 60px 80px; color: black;}
.inquiry .inquiry-form label { margin-bottom: 5px;}
.inquiry .inquiry-form input { margin-bottom: 15px;}
.inquiry .inquiry-form select:nth-child(1) { margin-top: 28px;}
.inquiry .inquiry-form textarea { margin-bottom: 10px;}
.inquiry .inquiry-form .form-inq span i { color: rgb(228, 1, 1); font-size: 6px;}
.inquiry .inquiry-form .form-control { box-shadow: none;}
.inquiry .inquiry-form .form-control:focus { border-color: #d43076;}
.inquiry .inquiry-form .btn_add { padding: 32px 35px;}
.inquiry .inquiry-form .photo_upload { background: white; height: 100px; width: 100px; display: flex; justify-content: center; align-items: center; margin-top: 10px;}
.inquiry .inquiry-form .btn_add i { font-size: 36px; color: #5a656e;}
.inquiry .agreement { margin: 20px 0;}
.inquiry .agreement .btn_area { display: flex; justify-content: center; align-items: center;}
.inquiry .agreement .btn_area a { padding: 10px 40px; margin: 0 10px;}
.inquiry .agreement .btn_area a:nth-child(2) { background: #808080;}

.error-message { display: none; color: #fff; background: #ed3c0d; text-align: center; padding: 15px;  font-weight: 600;}
.sent-message { display: none; color: #fff; background: #18d26e; text-align: center; padding: 15px; font-weight: 600;}
.loading { display: none; background: #fff; text-align: center; padding: 15px;}
.loading:before {  content: "";  display: inline-block;  border-radius: 50%;  width: 24px;  height: 24px;  margin: 0 10px -6px 0;  border: 3px solid #18d26e;  border-top-color: #eee;  -webkit-animation: animate-loading 1s linear infinite;  animation: animate-loading 1s linear infinite;}

/*--------------------------------------------------------------
# Testimonials
--------------------------------------------------------------*/
.testimonials .section-header { margin-bottom: 40px;}
.testimonials .testimonial-item { text-align: center;}
.testimonials .testimonial-item .testimonial-img { width: 100%; height: 100%;  border: 4px solid #fff; margin: 0 auto;}
.testimonials .testimonial-item h3 { font-size: 20px; font-weight: bold; margin: 10px 0 5px 0; color: #111;}
.testimonials .testimonial-item h4 { font-size: 14px; color: #999; margin: 0 0 15px 0;}
.testimonials .testimonial-item .quote-icon-left, .testimonials .testimonial-item .quote-icon-right {  color: #90c8fc;  font-size: 26px;}

.testimonials .testimonial-item .quote-icon-left {
  display: inline-block;
  left: -5px;
  position: relative;
}

.testimonials .testimonial-item .quote-icon-right {
  display: inline-block;
  right: -5px;
  position: relative;
  top: 10px;
}

.testimonials .testimonial-item p {
  font-style: italic;
  margin: 0 auto 15px auto;
}

.testimonials .owl-nav, .testimonials .owl-dots {
  margin-top: 5px;
  text-align: center;
}

.testimonials .owl-dot {
  display: inline-block;
  margin: 0 5px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background-color: #ddd !important;
}

.testimonials .owl-dot.active {
  background-color: #0563bb !important;
}

.testimonials .row {
  margin-bottom: 30px;
}

/*--------------------------------------------------------------
# Direction
--------------------------------------------------------------*/
.direction .map iframe {
  height: 400px;
  width: 100%;
}

.direction .map-direction {
  margin: 20px 0;
}

.direction .map-direction h3 {
  font-size: 18px;
}

.direction .map-direction p {
  font-size: 20px;
}

.direction .map-direction .btn-street {
  display: flex;
  justify-content: center;
  align-items: center;
}

.direction .map-direction a {
  border: 1px solid black;
  color: black;
  background: #808080;
  padding: 10px 30px;
  margin: 0 10px;
  border-radius: 4px;
}

.direction .map-direction a i {
  color: #af2963;
}

.direction .location-contact {
  margin: 40px 0;
}

.direction .location-contact i {
  margin: 0 10px;
}

.direction .area_account h3 {
  font-size: 17px;
  color: white;
}

.direction .direction-footer{
  background: rgb(31, 1, 114);
  padding-top: 60px;
  padding-bottom: 40px;
}

.direction .area_account .col-lg-4:nth-child(2) p,
.direction .notice p {
  color: #747272;
  font-size: 17px;
}

.direction .area_account .col-6 p{
  color: #dacfcf;
}

.direction .area_account i {
  font-size: 18px;
  margin: 0 10px;
}

.direction .area_account .notice {
  margin: 10px 0;
  text-align: center;
}

.direction .area_account .notice p {
  margin: 0;
}

.direction .area_account .notice a {
  font-size: 12px;
}

.direction .area_account .notice i {
  margin: 0 5px;
}


/*--------------------------------------------------------------
# Contact
--------------------------------------------------------------*/
.contact .info {
  width: 100%;
  background: #fff;
}

.contact .info i {
  font-size: 20px;
  color: #0563bb;
  float: left;
  width: 44px;
  height: 44px;
  background: #eef7ff;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50px;
  transition: all 0.3s ease-in-out;
}

.contact .info h4 {
  padding: 0 0 0 60px;
  font-size: 22px;
  font-weight: 600;
  margin-bottom: 5px;
  color: #45505b;
}

.contact .info p {
  padding: 0 0 0 60px;
  margin-bottom: 0;
  font-size: 14px;
  color: #728394;
}

.contact .info .email, .contact .info .phone {
  margin-top: 40px;
}

.contact .info .email:hover i, .contact .info .address:hover i, .contact .info .phone:hover i {
  background: #0563bb;
  color: #fff;
}

.contact .php-email-form {
  width: 100%;
  background: #fff;
}

.contact .php-email-form .form-group {
  padding-bottom: 8px;
}

.contact .php-email-form .validate {
  display: none;
  color: red;
  margin: 0 0 15px 0;
  font-weight: 400;
  font-size: 13px;
}

.contact .php-email-form .error-message {
  display: none;
  color: #fff;
  background: #ed3c0d;
  text-align: left;
  padding: 15px;
  font-weight: 600;
}

.contact .php-email-form .error-message br + br {
  margin-top: 25px;
}

.contact .php-email-form .sent-message {
  display: none;
  color: #fff;
  background: #18d26e;
  text-align: center;
  padding: 15px;
  font-weight: 600;
}

.contact .php-email-form .loading {
  display: none;
  background: #fff;
  text-align: center;
  padding: 15px;
}

.contact .php-email-form .loading:before {
  content: "";
  display: inline-block;
  border-radius: 50%;
  width: 24px;
  height: 24px;
  margin: 0 10px -6px 0;
  border: 3px solid #18d26e;
  border-top-color: #eee;
  -webkit-animation: animate-loading 1s linear infinite;
  animation: animate-loading 1s linear infinite;
}

.contact .php-email-form input, .contact .php-email-form textarea {
  border-radius: 4px;
  box-shadow: none;
  font-size: 14px;
}

.contact .php-email-form input {
  height: 44px;
}

.contact .php-email-form textarea {
  padding: 10px 12px;
}

.contact .php-email-form button[type="submit"] {
  background: #0563bb;
  border: 0;
  padding: 10px 35px;
  color: #fff;
  transition: 0.4s;
  border-radius: 50px;
}

.contact .php-email-form button[type="submit"]:hover {
  background: #0678e3;
}

@-webkit-keyframes animate-loading {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@keyframes animate-loading {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}





/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
#footer {
  background: #f7f8f9;
  color: #45505b;
  font-size: 14px;
  text-align: center;
  padding: 30px 0;
}

#footer h3 {
  font-size: 36px;
  font-weight: 700;
  position: relative;
  font-family: "Poppins", sans-serif;
  padding: 0;
  margin: 0 0 15px 0;
}

#footer p {
  font-size: 15;
  font-style: italic;
  padding: 0;
  margin: 0 0 40px 0;
}

#footer .social-links {
  margin: 0 0 40px 0;
}

#footer .social-links a {
  font-size: 18px;
  display: inline-block;
  background: #0563bb;
  color: #fff;
  line-height: 1;
  padding: 8px 0;
  margin-right: 4px;
  border-radius: 50%;
  text-align: center;
  width: 36px;
  height: 36px;
  transition: 0.3s;
}

#footer .social-links a:hover {
  background: #0678e3;
  color: #fff;
  text-decoration: none;
}

#footer .copyright {
  margin: 0 0 5px 0;
}

#footer .credits {
  font-size: 13px;
}

/*!
     * Waves v0.6.0
     * http://fian.my.id/Waves
     *
     * Copyright 2014 Alfiana E. Sibuea and other contributors
     * Released under the MIT license
     * https://github.com/fians/Waves/blob/master/LICENSE
     */
     .waves-effect {
      position: relative;cursor: pointer;display: inline - block;overflow: hidden; - webkit - user - select: none; - moz - user - select: none; - ms - user - select: none;user - select: none; - webkit - tap - highlight - color: transparent;vertical - align: middle;z - index: 1; - webkit - transition: .3 s ease - out;transition: .3 s ease - out
  }
  .waves - effect.waves - ripple {
      position: absolute;border - radius: 50 % ;width: 20 px;height: 20 px;margin - top: -10 px;margin - left: -10 px;opacity: 0;background: rgba(0, 0, 0, 0.2); - webkit - transition: all 0.7 s ease - out;transition: all 0.7 s ease - out; - webkit - transition - property: opacity,
      -webkit - transform;transition - property: opacity,
      -webkit - transform;transition - property: transform,
      opacity;transition - property: transform,
      opacity,
      -webkit - transform; - webkit - transform: scale(0);transform: scale(0);pointer - events: none
  }.waves - effect.waves - light.waves - ripple {
      background - color: rgba(255, 255, 255, 0.45)
  }.waves - effect.waves - red.waves - ripple {
      background - color: rgba(244, 67, 54, 0.7)
  }.waves - effect.waves - yellow.waves - ripple {
      background - color: rgba(255, 235, 59, 0.7)
  }.waves - effect.waves - orange.waves - ripple {
      background - color: rgba(255, 152, 0, 0.7)
  }.waves - effect.waves - purple.waves - ripple {
      background - color: rgba(156, 39, 176, 0.7)
  }.waves - effect.waves - green.waves - ripple {
      background - color: rgba(76, 175, 80, 0.7)
  }.waves - effect.waves - teal.waves - ripple {
      background - color: rgba(0, 150, 136, 0.7)
  }.waves - effect input[type = "button"], .waves - effect input[type = "reset"], .waves - effect input[type = "submit"] {
      border: 0;font - style: normal;font - size: inherit;text - transform: inherit;background: none
  }.waves - effect img {
      position: relative;z - index: -1
  }.waves - notransition {
      -webkit - transition: none!important;
      transition: none!important
  }.waves - circle {
      -webkit - transform: translateZ(0);
      transform: translateZ(0); - webkit - mask - image: -webkit - radial - gradient(circle, white 100 % , black 100 % )
  }.waves - input - wrapper {
      border - radius: 0.2 em;
      vertical - align: bottom
  }.waves - input - wrapper.waves - button - input {
      position: relative;top: 0;left: 0;z - index: 1
  }.waves - circle {
      text - align: center;
      width: 2.5 em;
      height: 2.5 em;
      line - height: 2.5 em;
      border - radius: 50 % ; - webkit - mask - image: none
  }.waves - block {
      display: block
  }.waves - effect.waves - ripple {
      z - index: -1
  }

img {
  border-radius: 8px;
}

.shadow {filter: drop-shadow(8px 8px 10px rgb(50, 124, 235));}

iframe, .inquiry-form {
  border-radius: 8px;
}