body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 18px;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
}

a:visited {
 color: inherit;
 text-decoration: none;
}

a {
    color: inherit;
    text-decoration: none;
}

a:link {
    color: inherit;
    text-decoration: none;
}

a:active {
    color:inherit;
    text-decoration: none;
}

h1 {
    font-size: 50px;
    font-weight: 600;
    line-height: 59px;
    color: #1d1d1d;
    margin-bottom: 20px;
}

audio::-webkit-media-controls-timeline,
video::-webkit-media-controls-timeline {
    display: none;
}
audio::-webkit-media-controls,
video::-webkit-media-controls {
    display: none;
}

.container {
    max-width: 85rem;
    padding: 50px 0px 50px 0px;
}

.navbar-mobile {
    padding-bottom:10px;
    border-bottom: 1px solid #acacac;
    background-color: white !important;
}

.bd-toc-link {
    color: black;
    font-size: 16px;
    font-weight: 500;
}

.navbar-lg {
    width: 100%;
    z-index: 1000;
    top: 0;
    position: fixed;
    height: 69px;
    padding: 15px  0px 10px 0px;
    border-bottom: 1px solid #e8e8e8;
    background-color: white;
}

.nav-archigene-logo {
    padding-bottom: 10px;
}

.logo-text {
    margin-top:15px;
    vertical-align: middle;
    font-weight: 700;
    font-size: 26px;
    padding-top: 5px;
    color: black;
    text-decoration: none;
}


.nav-link {
    font-family: 'Segoe UI';
    padding: 10px  15px 15px 15px !important;
    color: #1d1d1d;
    font-weight: 400;
    font-size: 18px;
}

.nav-link:hover {
    color: #313131;
}

.dropdown-toggle:after { content: none }

.dropdown:hover .dropdown-menu {
    display: block;
 }

 .dropdown-menu {
    margin-top: 0px;
    box-shadow: 0 0 2rem rgba(0,0,0,.1);
    transition: min-width 1s cubic-bezier(.165,.84,.44,1);
    border: 1px solid #e8e8e8;
 }

/**********************************/
 .btn-launch {
     color: white !important;
     background-color: #006C70;
 }

 .btn-launch:hover {
    color: white !important;
    background-color: rgb(0, 87, 102);
}

.btn-green {
    padding: 12px 30px 12px 30px;
    font-size:18px;
    font-weight: 600;
    color: white !important;
    background-color: #006C70;
}

.btn-green:hover {
    color: white !important;
    background-color: rgb(0, 87, 102);
}

.btn-default {
    padding: 12px 30px 12px 30px;
    font-size:18px;
    font-weight: 600;
    border: 1px solid #006C70;
    background-color: white !important;
    color: #006C70 !important;
}

.btn-default:hover {
    color: white !important;
    background-color: #006C70 !important;
}

.btn-better-white {
    padding: 12px 30px 12px 30px;
    font-size:18px;
    font-weight: 600;
    background-color: white !important;
    color: #37336B !important;
}

.btn-better-transparent {
    padding: 12px 30px 12px 30px;
    font-size:18px;
    font-weight: 600;
    background-color: #37336B !important;
    color: white !important;
    border: 1px solid white !important;
}

.btn-better-transparent:hover {
    background-color: #37336B !important;
    color: white !important;
    border: 1px solid rgb(159, 155, 224);
}

.btn-blue {
    padding: 15px 50px 15px 50px;
    background-color: #37336B !important;
    color: white !important;
    font-size: 18px;
    font-weight: 500;
}

.btn-blue:link {
    text-decoration: none !important;
    color: white !important;
}

.btn-blue:hover {
    text-decoration: none !important;
    color: white !important;
}

.btn-plan-select {
    padding: 10px 50px 15px 50px;
    border-color: #37336B !important;
    color: #37336B !important;
    font-size: 18px;
    font-weight: 500;
    background-color: white;
}

.btn-plan-select:hover {
    background-color:  #efefef;
}

.btn-plan-selected {
    background-color: rgb(230, 230, 255);
}

.faq-card {
    box-shadow: 0 0 2px rgba(0,0,0,.1);
}

.faq-title {
    color: black;
    font-size: 21px;
    font-weight: 500;
    background-color: white;
}

.form-control-blue {
    border-color: #37336B;
    padding-top: 15px;
    padding-bottom: 15px;
}

.btn-border-blue {
    padding: 15px 50px 15px 50px;
    border-color: #37336B;
    color: #37336B;
    font-size: 18px;
    font-weight: 500;
}

.btn-border-blue:hover {
    background-color:  #efefef;
}


/**********************************/
.content {
     margin-top:69px;
}

.container-gray {
    background-color: #F5F5F5;
}

.img-content {
    box-shadow: 0 0 2rem rgba(0,0,0,.1);
    border-radius: 10px;
    margin-left: auto;
    margin-right: auto;
    display: block;
}

.service-background {
    color: rgb(0, 132, 137) !important;
}


.container-footer {
    max-width: 85rem;
    padding: 20px 0px 10px 0px;
}

.card-services {
    width: 20rem;
    box-shadow: 0 0 2rem rgba(0,0,0,.1);
    -webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}

.card-services:hover {
-webkit-transform: scale(1.03);
	transform: scale(1.03);
}


/*********************************************************/
.card-whats-new {
    width: 20rem;
    box-shadow: 0 0 2rem rgba(0,0,0,.1);
    -webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
    cursor: pointer;
}

.card-whats-new:hover {
-webkit-transform: scale(1.06);
	transform: scale(1.06);
}


.card-footer {
    background-color: white;
    border:none;
}

/*********************************************************/

#database-main-1 {
    height: 250px;
    position: absolute;
    animation-name: anim-database-main-1;
    animation-duration: 20s;  
    animation-delay: 0s;
    animation-fill-mode: backwards;
    animation-iteration-count: infinite;
}

#database-main-2 {
    height: 250px;
    position: absolute;
    animation-name: anim-database-main-2;
    animation-duration: 20s;  
    animation-delay: 0s;
    animation-fill-mode: backwards;
    animation-iteration-count: infinite;
}

#database-main-3 {
    height: 250px;
    position: absolute;
    animation-name: anim-database-main-3;
    animation-duration: 20s;  
    animation-delay: 0s;
    animation-fill-mode: backwards;
    animation-iteration-count: infinite;
}

@keyframes anim-database-main-1 {
    0%    {left:100px; top:0px; z-index: 10;}
    20%   {left:100px; top:0px; z-index: 10;}
    30%   {left:100px; top:0px; z-index: 10;}
    40%   {left:0px;   top:100px; z-index: 11;}
    50%   {left:0px;   top:100px; z-index: 11;}
    60%   {left:0px;   top:100px;  z-index: 11;}
    70%   {left:100px; top:200px; z-index: 10;}
    80%   {left:100px; top:200px; z-index: 10;}
    90%   {left:100px; top:200px; z-index: 10;}
    100%  {left:100px; top:0px; z-index: 10;}
}

@keyframes anim-database-main-2 {
    0%    {left:0px; top:100px; z-index: 11;}
    20%   {left:0px; top:100px; z-index: 11;}
    30%   {left:0px; top:100px; z-index: 11;}
    40%   {left:100px; top:200px; z-index: 10;}
    50%   {left:100px; top:200px; z-index: 10;}
    60%   {left:100px; top:200px; z-index: 10;}
    70%   {left:100px; top:0px; z-index: 10;}
    80%   {left:100px; top:0px; z-index: 10;}
    90%   {left:100px; top:0px; z-index: 10;}
    100%  {left:0px; top:100px; z-index: 10;}
}

@keyframes anim-database-main-3 {
    0%    {left:100px; top:200px; z-index: 10;}
    20%   {left:100px; top:200px; z-index: 10;}
    30%   {left:100px; top:200px; z-index: 10;}
    40%   {left:100px; top:0px; z-index: 10;}
    50%   {left:100px; top:0px; z-index: 10;}
    60%   {left:100px; top:0px; z-index: 10;}
    70%   {left:0px; top:100px; z-index: 11;}
    80%   {left:0px; top:100px; z-index: 11;}
    90%   {left:0px; top:100px; z-index: 11;}
    100%  {left:100px; top:200px; z-index: 10;}
}


/*********************************************************/

.card-plan {
    box-shadow: 0 1px 30px 0 rgba(0,0,0,.1);
    border-radius: 7px;
}

.card-plan-green {
    border-top: 10px solid #008489;
}
.card-plan-blue {
    border-top: 10px solid #2E81C2;
}
.card-plan-orange {
    border-top: 10px solid #E9B12B;
}

.plan-text {
    font-size: 20px;
    line-height: 1.7em;
}

.btn-plan-buy {
    border-radius: 10px;
    color: white;
    font-size: 24px;
    width: 100%;
}

.btn-plan-buy-green {
    background-color: rgba(0, 132, 137, 0.8);
    border: 1px solid rgb(0, 132, 137);
}

.btn-plan-buy-green:hover {
    color: white;
    background-color: rgb(0, 132, 137);
    border: 1px solid rgb(0, 132, 137);
    box-shadow: 0 0.2rem 0.6rem rgba(0, 0, 0, 0.6);
}

.btn-plan-buy-blue {
    background-color: #2E81C2bb;
    border: 1px solid #2E81C2;
}

.btn-plan-buy-blue:hover {
    color: white;
    background-color: #2E81C2;
    border: 1px solid #2E81C2;
    box-shadow: 0 0.2rem 0.6rem rgba(0, 0, 0, 0.6);
}

.btn-plan-buy-orange {
    background-color: #E9B12Bbb;
    border: 1px solid #E9B12B
}

.btn-plan-buy-orange:hover {
    color: white;
    background-color: #E9B12B;
    border: 1px solid #E9B12B;
    box-shadow: 0 0.2rem 0.6rem rgba(0, 0, 0, 0.6);
}

.btn-plan-buy-trial {
    background-color: white;
    border: 1px solid gray;
    color: black;
}

.btn-plan-buy-trial:hover {
    color: white;
    background-color: #2E81C2;
    border: 1px solid #2E81C2;
    box-shadow: 0 0.2rem 0.6rem rgba(0, 0, 0, 0.6);
}

.contact-container {
    width: 700px;
}

.header-contact-container {
    background-color: #37336B; 
    padding-bottom:130px; 
    padding-top:70px;
    z-index:10;
}

.form-contact-container {
    box-shadow: 0 0 2rem rgba(0,0,0,.1);
    z-index:11;
    margin-top:-80px;
    margin-bottom: 40px;
    background-color: white;
    border-radius: 2px;
    padding: 40px 40px 40px 40px; 
    font-size: 18px;
    font-weight: 500;
}

/*************************************************/
.card-faq {
    cursor: pointer;
    box-shadow: 0 0 2rem rgba(0,0,0,.1);
    z-index:11;
    margin-top:-80px;
    margin-bottom: 40px;
    background-color: white;
    border-radius: 2px;
    padding: 40px 40px 40px 40px; 
    font-size: 18px;
    font-weight: 500;
    color: #444444;
    border-color: #f8f8f8;
}

.card-faq:hover {
    border-color: #37336B;
}

.card-faq-selected {
    border-color: #37336B;
    color: #37336B;
}

/*************************************************/
.card-pricing {
    border-radius:0px;
    box-shadow: 0 0 2rem rgba(0,0,0,.1);
}

.card-header-pricing {
    height: 10px;
    background-color: #37336B;
}


/************************************************/

.solution-top {
    background: linear-gradient(90deg,#ffffff,#ffffff57),url(/img/solution-1.png) no-repeat top right;
    background-size: cover;
    background-position-x: 81%;
    height: 500px;
}

.check-icon {
    background-image: url(/img/green-check.png);
    width: 30px;
    height: 30px;
    display: inline-block;
    background-repeat: no-repeat;
    background-size: contain;
    vertical-align: top;
}

.check-icon-text {
    display: inline-block;
    line-height: 1.6;
    margin-left: 15px;
    max-width: 75%;
    font-weight: 400;
}

/*************************************************/
.sitemap {
    max-width: 85rem;
}

.sitemap-link {
    color: #444444;
    font-size: 16px;
    font-weight: 500;
}

.sitemap-link:hover {
    color: #333333;
    text-decoration: none;
}

.copyright {
    font-size:12px;
    font-weight: 400;
}

footer {
    background-color: #EBEAEB;
    height: 120px;  
}

.footer-sn-icon {
    fill: #006C70;
    margin-right:5px;
}

.footer-sn-icon:hover {
    fill: rgb(0, 87, 102);
}

.footer-link {
    margin-right:10px;
    color: black;
    font-size: 18px;
    font-weight: 500;
}

.footer-link:hover {
    color: #333333;
    text-decoration: none;
}



/*-----------------------------------
  BUY
-------------------------------------*/
.buytopnav {
    padding: 0;
    margin: 0;
    font-size: 0;
    border-radius: 4px;
    overflow: hidden;
    width: 100%;
    display: block;
    margin-bottom: 40px;
  }
  
  .buytopnav .step1.step1-selected  {
      background: #E8E8E8 url("../img/step-1.png") right center no-repeat;
      color: #333;
      background-size: 30px auto;
  }
  
  .buytopnav .step1.step2-selected {
    background: rgb(248,248,248) url("../img/step-2.png") right center no-repeat;
    color: #a8a8a8;
    background-size: 30px auto;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
  }
  
  .buytopnav .step2.step2-selected {
    background-color:rgb(233,233,233);
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
  }
  
  .buytopnav .btn {
    font-size: 12px;
    padding: 14px 0 14px 6px;
    width: 50%;
    height: 50px;
    display: inline-block !important;
    font-size: 16px;
    font-weight: 500;
    text-align: left;
    border: none;
  }
  
  .buytopnav .step2 {
    background: #F8F8F8 none;
  }
  
  .buy-left-panel {
    width: 580px;
    display: inline-block !important;
  }
  
  .buy-right-panel {
    width: 280px;
    display: inline-block !important;
    vertical-align: top;
    margin-left: 35px;
  }
  
  .buy-plan-title {
    font-size: 26px;
    font-weight: 300;
    color: #333;
    line-height: 32px;
    padding: 9px 20px;
    background: #f4f4f4 none;
    border-radius: 3px;
    position: relative;
    height: 58px;
    display: block;
  }
  
  .buy-user {
    width: 60px !important;
    display: inline-block !important;
  }
  
  .buy-duration {
    width: 255px;
    height: 250px;
    background-color: white;
    border: 1px solid rgb(208, 208, 208);
    border-radius: 10px;
    display: inline-block !important;
    text-align: center;
    cursor: pointer;
  }
  
  .buy-duration-selected {
    border: 2px solid #F26D21;
    background-color: #FFF5ED;
  }
  
  .circle-save {
    position: absolute;
    background-color:#0FAA4B;
    height: 80px;
    width: 80px;
    border-radius: 50%;
    margin-left: 205px;
    margin-top: -20px;
    color: white;
    padding-top:8px;
    font-size: 20px;
    font-weight: 500;
  }
  
  .buy-save-content {
    background-color:#0FAA4B;
    color: white;
    font-weight: 400;
    font-size: 16px;
    margin-top: 4px;
  }
  
  .box-plan {
    box-shadow: 0 1px 5px rgba(0,0,0,.2);
  }
  
  .button-plan {
    background-color:white;
    border: 1px solid rgb(208, 208, 208);
    border-radius: 10px;
    width: 100%;
    font-size: 22px;
    cursor: pointer;
  }
  
  .button-plan:hover {
    background-color: #FFEBDA;
    border: 1px solid #FFEBDA;
  }
  
  .button-demo-plan {
    background-color:#007bff;
    border: 1px solid rgb(208, 208, 208);
    color: white !important;
    border-radius: 10px;
    width: 100%;
    font-size: 22px;
    cursor: pointer;
  }
  
  .button-plan-disabled {
    border: 1px solid rgb(208, 208, 208) !important;
    cursor: default;
  }
  
  .button-plan-disabled:hover {
    border: 1px solid rgb(208, 208, 208) !important;
    cursor: default;
    background-color: white !important;
  }
  
  .button-demo-plan:hover {
    background-color: #026bdb;
  }
  
  .profile-content {
    margin-right: 25px;
  }






  
.card-register-info {
    margin-top:160px;
    width:500px; 
    margin-left:auto; 
    margin-right:auto;
  }
  
  .card-register-title {
    color: black;
    font-size: 28px;
  }
  
  .card-register-body {
    color: gray !important;
    font-size: 18px;
  }
  
  .card-login-info {
    margin-top: 160px;
    width:600px; 
    margin-left:auto; 
    margin-right:auto;
  }
  
  .card-login-title {
    color: black;
    font-size: 28px;
  }
  
  .card-login-body {
    color: gray !important;
    font-size: 18px;
  }

  

/*********************************************************/
.right-login-panel {
    min-height: 100vh;
    background: linear-gradient(90deg, rgba(0, 0, 61, 0), rgba(0, 0, 61, 0.8) 70.71%),
              linear-gradient(180deg, rgba(13, 0, 78, 0), rgba(13, 0, 78, 0.8) 70.71%),
              linear-gradient(360deg, rgba(5, 0, 71, 0), rgba(5, 0, 71, 0.8) 70.71%);
  }
  
  
  .button-green {
    background: rgb(0, 108, 112) !important;
    border-color: rgb(0, 108, 112) !important;
    color: rgb(255, 255, 255) !important;
    border-radius: 4px !important;
    text-decoration: none !important;
    background: rgb(0, 132, 137) !important;
    border-width: 1px !important;
    border-style: solid !important;
    border-color: rgb(0, 132, 137) !important;
  }
  
.btn-cookies {
    color: #FFFFFFCC;
    border-color: #FFFFFFCC;
    font-weight: 500;
    font-size: 16px;
}

.btn-cookies:hover {
    color: white;
    border-color: white;
    background-color:#000000bb;
}


.video-button {
    cursor:pointer;
    border-radius:7px;
    position:absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    z-index: 2; 
    background-color: rgb(39, 101, 165);
    padding-top:3px;
}

.video-button:hover {
    background-color: rgb(28, 80, 133);
}

.video-image {
    position:absolute;
    z-index:1;
    height:100%;
    width:100%;
}

.video-container {
    position:relative; 
    height: 500px; 
    width:100%; 
    max-width:870px; 
    box-shadow: 0 0 1.5rem rgba(105,105,105,.5);
}

.video-close-button {
    background-color: #000000 !important;
    border-radius: 45px !important;
    width: 50px !important;
    height: 50px !important;
    color:white;
    position: absolute;
    top: -6%;
    right: -6%;
    cursor: pointer !important;
    z-index: 30000 !important;
    padding-bottom: 8px !important;
}


.full-modal-dialog {
    top:10% !important;
    width: 80% !important;
    height: 78% !important;
    min-width: 80% !important;
    min-height: 78% !important;
    max-width: 80% !important;
    max-height: 78% !important;
    padding: 0 !important;
}

.full-modal-content {
    height: 80% !important;
    min-height: 80% !important;
    max-height: 80% !important;
}