/*
Table of content
1. Default css
2. Preloader css
3. Navbar css
4. Banner area css
5. About area css
6. Services area css
7. Portfolio starts css
8. Testimonial area css
9. Invitation area css
10. Contact area css
11. Footer area css
*/
/*--- 1. Default CSS Starts ---*/
body {
  width: 100%;
  height: 100%;
  line-height: 24px;
  font-size: 13px;
  font-family: "Poppins", sans-serif;
  font-weight: normal;
  letter-spacing: 1px;
}

html {
  width: 100%;
  height: 100%;
}

.clearfix:before,
.clearfix:after {
  content: " ";
  display: table;
}

.clearfix:after {
  clear: both;
}

.clearfix {
  *zoom: 1;
}

.no-padding {
  padding: 0;
}

a,
a:focus,
a:active,
a:link,
img {
  outline: none;
}

a {
  cursor: pointer;
  text-decoration: none;
  color: #323232;
  transition: all 0.25s ease 0s;
  -moz-transition: all 0.25s ease 0s;
  -webkit-transition: all 0.25s ease 0s;
  -o-transition: all 0.25s ease 0s;
}

a:hover {
  color: #003aff;
  text-decoration: none;
  transition: all 0.25s ease 0s;
  -moz-transition: all 0.25s ease 0s;
  -webkit-transition: all 0.25s ease 0s;
  -o-transition: all 0.25s ease 0s;
}

a:focus {
  outline: none;
  outline-offset: 0;
}

a:link,
a:visited {
  text-decoration: none;
}

p {
  line-height: 26px;
  font-size: 16px;
  font-weight: 400;
  color: #666;
}

img {
  height: auto;
  max-width: 100%;
  border: none;
  outline: none;
  transition: all 0.2s ease 0s;
  -moz-transition: all 0.2s ease 0s;
  -webkit-transition: all 0.2s ease 0s;
  -o-transition: all 0.2s ease 0s;
}

ul,
li {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 700;
  margin-top: 0;
  margin-bottom: 10px;
  color: #333333;
  text-transform: uppercase;
}

.section-padding {
  padding: 105px 0 90px 0;
}

.bg-overlay {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: 100%;
}

.bg-overlay.black {
  position: absolute;
  background: linear-gradient(120deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.6) 50%, rgba(0, 0, 0, 0) 80%);
}

.section-header {
  margin-bottom: 100px;
  text-align: center;
}

.section-header h2 {
  font-size: 27px;
  line-height: 37px;
  margin-bottom: 20px;
  padding-top: 10px;
  font-weight: 600;
  color: #333333;
}

.section-header h2::before {
  position: absolute;
  content: "";
  height: 2px;
  width: 80px;
  left: 50%;
  top: 60px;
  text-align: center;
  z-index: -1;
  background: #003aff;
  margin-left: -40px;
}

.section-header h2::after {
  position: absolute;
  content: "";
  height: 15px;
  width: 15px;
  left: 50%;
  top: 53px;
  text-align: center;
  z-index: -1;
  background: #003aff;
  margin-left: -7px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

/*--- 1. Default CSS Ends ---*/
/*-------------- 2. Preloader css starts ---------------*/
.loader_bg {
  position: fixed;
  z-index: 9999999;
  background: #fff;
  width: 100%;
  height: 100%;
}

.loader {
  border: 0 solid transparent;
  border-radius: 50%;
  width: 150px;
  height: 150px;
  position: absolute;
  top: calc(50vh - 75px);
  left: calc(50vw - 75px);
}

.loader:before, .loader:after {
  content: "";
  border: 1em solid #003aff;
  border-radius: 50%;
  width: inherit;
  height: inherit;
  position: absolute;
  top: 0;
  left: 0;
  animation: loader 2s linear infinite;
  opacity: 0;
}

.loader:before {
  animation-delay: 0.5s;
}

@keyframes loader {
  0% {
    transform: scale(0);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    transform: scale(1);
    opacity: 0;
  }
}
/*---------- preloader css ends -------------*/
/*--- 3. Navbar css starts ---*/
.navbar-custom {
  margin-bottom: 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
  background: #fff;
  text-transform: uppercase;
}

.navbar-custom .navbar-brand {
  font-weight: 700;
  font-size: 35px;
  position: relative;
  top: -10px;
}
.navbar-custom .navbar-brand img {
  width: 40px;
  float: left;
  position: relative;
  margin-right: 15px;
  margin-top: 4px;
}
.navbar-custom .navbar-brand .logo_text {
  float: right;
}

.navbar-custom .navbar-brand:focus {
  outline: 0;
}

.navbar-custom .navbar-brand .navbar-toggle {
  padding: 4px 6px;
  font-size: 16px;
  color: #fff;
}

.navbar-custom .navbar-brand .navbar-toggle:focus,
.navbar-custom .navbar-brand .navbar-toggle:active {
  outline: 0;
}

.navbar-custom a {
  color: #fff;
  font-size: 16px;
  letter-spacing: 3px;
  font-weight: 600;
}

.navbar-custom .nav li a {
  -webkit-transition: background 0.3s ease-in-out;
  -moz-transition: background 0.3s ease-in-out;
  transition: background 0.3s ease-in-out;
}

.navbar-custom .nav li a:hover {
  outline: 0;
  color: rgba(255, 255, 255, 0.8);
  background-color: transparent;
}

.navbar-custom .nav li a:focus,
.navbar-custom .nav li a:active {
  outline: 0;
  background-color: transparent;
}

.navbar-custom .nav li.active {
  outline: 0;
}

@media (min-width: 768px) {
  .navbar-custom {
    padding: 20px 0;
    border-bottom: 0;
    letter-spacing: 1px;
    background: 0 0;
    -webkit-transition: background 0.5s ease-in-out, padding 0.5s ease-in-out;
    -moz-transition: background 0.5s ease-in-out, padding 0.5s ease-in-out;
    transition: background 0.5s ease-in-out, padding 0.5s ease-in-out;
  }

  .navbar-custom.top-nav-collapse {
    -webkit-box-shadow: 0px 0px 2px #777;
    box-shadow: 0px 0px 2px #777;
    background-color: #111;
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.1);
  }

  .navbar-custom.top-nav-collapse .nav li a {
    color: #fff;
  }
  .navbar-custom.top-nav-collapse .nav li a:hover {
    color: rgba(255, 255, 255, 0.8);
  }

  .navbar-custom.top-nav-collapse .nav li.active a {
    background-color: transparent;
    color: #003aff !important;
  }

  .navbar-custom.top-nav-collapse .navbar-brand {
    color: #fff;
  }

  .active a {
    color: #003aff !important;
  }
}
.navbar-nav {
  margin-top: 5px;
}

.logo_top {
  font-family: Poppins;
  font-size: 26px;
  position: relative;
  color: #003aff;
  letter-spacing: -0.1px;
  font-weight: 600;
  text-transform: uppercase;
}

.logo_bottom {
  display: block;
  font-size: 18px;
  letter-spacing: 1px;
  color: white;
  font-weight: 500;
  margin-top: 1px;
  text-transform: uppercase;
}
#lang{
  font-size: 16px;
  font-weight: 400;
  padding: 5px 20px;
  position: absolute;
  top: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  background-color: #003aff;
  border-radius: 7px;
  letter-spacing: 1px
}
#lang:hover{
  background-color: #fff;
  color: #003aff;
  transition: all 0.5 ease-in-out;
}
#ionclean{
  display: none;
}
@media screen and (min-width: 1200px){

  #ionclean{
    display: block;
    z-index: 10000;
    position: fixed;
    top: 15px;
    right: 10px;
  }
  #ionclean img{
    width: 115px;
  }
}

/*--- 3. Navbar css ends ---*/
/*--- 4. Banner area css starts ---*/
.banner-area {
  background: #222 url("../images/home/bg-home.jpg") no-repeat fixed 100% 100%/cover;
  padding: 0;
  position: relative;
  overflow: hidden;
  padding: 0 0 5rem 0;
}

.welcome-text {
  text-align: center;
  color: #fff;
  padding-top: 140px;
}

.color-primary {
  color: #003aff;
  font-size: 80px;
}

.welcome-text h1 {
  text-align: left;
  font-size: 92px;
  color: #fff;
  line-height: 0.8;
  margin: 30px 0px;
}

.welcome-text .name-area {
  text-align: left;
  margin: 30px 0;
  font-size: 20px;
  line-height: 1.3;
  font-weight: 400;
  max-width: 600px;
}

.my-btn {
  display: inline-block;
  font-size: 14px;
  line-height: 1.5;
  text-transform: uppercase;
  text-align: center;
  padding: 13px 32px;
  margin-top: 20px;
  margin-left: 5px;
  margin-right: 5px;
  border-radius: 30px;
  transition: all 0.4s ease;
  white-space: nowrap;
  vertical-align: middle;
  touch-action: manipulation;
  -ms-touch-action: manipulation;
  cursor: pointer;
}

.my-btn-1 {
  background: #003aff;
  color: #fff;
}
.my-btn-1:hover {
  background: #fff;
  color: #003aff;
}

.my-btn-2 {
  background: #fff;
  color: #003aff;
}
.my-btn-2:hover {
  background: #003aff;
  color: #fff;
}

.button {
  animation: flipInX 1s both 1.5s;
  text-align: left;
  position: relative;
  left: -5px;
}

/*--- 4. Banner area css ends ---*/
/*--- 5. About area css starts ---*/
#about{
  padding-bottom: 0;
}
.line {
  height: 2px;
  background: #003aff;
  width: 200px;
}

.about-left h2 {
  font-size: 27px;
  line-height: 37px;
  margin-bottom: 20px;
  padding-top: 10px;
  font-weight: 600;
  color: #333333;
}

.about-left h4 {
  text-transform: none;
  font-weight: 400;
  font-size: 22px;
  line-height: 34px;
  margin: 20px 0 10px;
  width: 80%;
}

.about-left a {
  color: #fff;
  background: #003aff;
}
.about-left a:hover {
  background: #0037a9;
}
.about-left a i {
  font-size: 18px;
  position: relative;
  left: 4px;
  top: 1px;
}
.about-left p {
  font-size: 16px;
}
.about-left p span {
  display: block;
  margin-top: 5px;
}
.about-left p span .tel {
  background: #fff;
  color: #003aff;
  font-size: 24px;
  font-weight: 600;
  transition: all 0.2s ease;
}
.about-left p span .tel:hover {
  border-bottom: 3px solid #003aff;
}

.profile::before {
  position: absolute;
  content: "";
  left: 0;
  top: 0;
  border: 12px solid #003aff;
  height: 350px;
  width: 350px;
  z-index: -1;
}

.profile::after {
  position: absolute;
  content: "";
  left: 167px;
  top: -77px;
  height: 558px;
  width: 92px;
  z-index: -1;
  background: #fff;
  transform: rotate(45deg);
}

.profile img {
  margin: 35px 20px;
  padding-right: 25px;
}

.about-text {
  float: left;
  z-index: 5;
}
.about-text-fl-right {
  float: right;
  z-index: 5;
}

/*--- 5. About area ends ---*/
/*--- 6. Services area css starts ---*/
.single-service {
  margin-bottom: 30px;
  padding: 10px;
  text-align: center;
}
.single-service p {
  text-align: left;
}

.single-service i {
  font-size: 50px;
  text-align: center;
  height: 80px;
  padding-top: 10px;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

.single-service img {
    width: 320px;
    height: 200px;
    object-fit: cover;
}

.single-service h2 {
  margin: 20px 0;
  font-size: 18px;
  font-weight: 600;
}

.single-service:hover i {
  color: #003aff;
  padding: 0;
}

.single-service:hover h2 {
  color: #003aff;
}

/*--- 6. services area ends ---*/
/*--- 9. Invitation area css starts ---*/
.invitation-area {
  background: #333333;
  color: #ffffff;
  background: linear-gradient(120deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 30%, rgba(0, 0, 0, 0.7) 70%, rgba(0, 0, 0, 0) 100%),url("../images/home/server-room.jpg");
  background-size: cover;
}

.single-invite h2 {
  font-size: 27px;
  line-height: 37px;
  margin-bottom: 20px;
  padding-top: 10px;
  font-weight: 600;
  color: #ffffff;
}

.single-invite p {
  width: 70%;
  margin: auto;
  color: #ffffff;
}

.single-invite a {
  display: inline-block;
  color: #fff;
  background: #003aff;
  margin-top: 20px;
}
.single-invite a:hover {
  background: #0037a9;
}

/*--- invitation area ends ---*/
/*-------------10. Contact area css starts -------------*/
.contact-area .form-control {
  border: none;
  border-bottom: 2px solid #a2a2a2;
  box-shadow: none;
  padding: 6px 0;
  border-radius: 0;
  margin-bottom: 30px;
}

#suhlas {
  width: auto;
  height: auto;
  display: inline-block;
  margin: 0px 10px 0px 0px;
}

input[type=submit] {
  margin-left: 0;
}

.contact-area textarea.form-control {
  border: 2px solid #a2a2a2;
  padding: 6px;
  height: 250px;
  margin-bottom: 30px;
}

.btn.btn-send {
  background: #003aff;
  color: #ffffff;
  font-weight: 600;
}
.btn.btn-send:hover {
  background: #0037a9;
}

/*------------- Contact area ends -------------*/
#portfolio, #testimonial {
  display: none;
}

/*=============================
    Start Footer CSS
===============================*/
.footer {
  background: #111;
}

.footer .footer-top {
  padding: 80px 0px;
}

.footer .single-footer {
  margin-top: 30px;
}

.footer .single-footer h3 {
  color: #fff;
  font-size: 19px;
  font-weight: 600;
  position: relative;
  padding-bottom: 20px;
  text-transform: uppercase;
  margin-bottom: 20px;
}
.footer .single-footer h3 a {
  color: white;
}
.footer .single-footer h3 a:hover {
  color: #003aff;
}

.footer .f-about .logo {
  margin-bottom: 23px;
}
.footer .f-about .logo img {
  width: 50px;
  float: left;
  position: relative;
  top: -7px;
  margin-right: 15px;
}
@media screen and (max-width: 769px) {
  .footer .f-about .logo img {
    display: none;
  }
}
.footer .f-about .logo .logo_text {
  float: right;
}
.footer .f-about .logo .navbar-brand {
  padding: 0 0 15px 0;
}

@media screen and (max-width: 769px) {
  .single-footer .logo .navbar-brand img {
    display: block;
  }
}

.footer .f-about .text {
  color: #ccc;
  margin-bottom: 9px;
  line-height: 24px;
}

/* Social */
.footer .f-about .social {
  margin-top: 20px;
}

.footer .f-about .social li {
  display: inline-block;
  margin-right: 10px;
}

.footer .f-about .social li:last-child {
  margin-right: 0px;
}

.footer .f-about .social li a {
  color: #ffffff9e;
  height: 38px;
  width: 38px;
  line-height: 38px;
  text-align: center;
  border: 1px solid #ffffff9e;
  border-radius: 100%;
  display: block;
  font-size: 14px;
}
.footer .f-about .social li a:hover {
  background: #003aff;
}

.footer .f-about .social li a:hover {
  background: #3353ea;
  border-color: #3353ea;
  color: #fff;
}

.footer .f-about .social li.active a {
  background: #3353ea;
  border-color: #3353ea;
  color: #fff;
}

/* Footer Link */
.footer .f-link ul li {
  margin-bottom: 15px;
}

.footer .f-link ul li:last-child {
  margin-bottom: 0px;
}

.footer .f-link ul li {
  color: #ccc;
}

.footer .f-link ul li a {
  display: inline-block;
  color: #ccc;
}

.footer .f-link ul li a:hover {
  color: #3353ea;
}

/* Copyright */
.footer .copyright {
  background: #111;
  text-align: left;
  overflow: hidden;
  border-top: 1px solid #fff3;
  padding: 20px 0;
}

.footer .copyright-content p {
  color: #ccc;
}

.footer .copyright-content p a {
  font-weight: 500;
  color: #ccc;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  transition: all 0.4s ease;
}

.footer .copyright-content p a:hover {
  color: #fff;
}

.footer .copyright-content .links {
  float: right;
}

.footer .copyright-content .links li {
  display: inline-block;
  margin-right: 15px;
}

.footer .copyright-content .links li:last-child {
  margin-right: 0px;
}

.footer .copyright-content .links li a {
  color: #ccc;
}

.footer .copyright-content .links li a:hover {
  color: #3353ea;
}

/*=============================
    / End Footer CSS
===============================*/
#about, #services, #contact, .invitation-area {
  padding-top: 50px;
}

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