/* ==================================
========== Login page ===========
================================== */

.sun {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}

.col-md-9.col-lg-12.col-xl-10.local {
  max-width: 1300px;
}

.col-md-9.col-lg-12.col-xl-10.login {
  max-width: 1000px;
}

.aptlogocenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}

.d-xl-flex.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}
.form2 {
/*display: flex;*/
flex-wrap: wrap;
margin-right: 18px;
margin-left: 18px;
}
.formrow2 {
display: flex;
flex-wrap: wrap;
padding-top:15px;
padding-bottom:25px;
padding-right: 10px;
padding-left:10px;
}

#errordevice {
width:100%;
transition:all 0.3s;
overflow:auto;
background-color:#ffffff;
}

#choices {
width:100%;
transition:all 0.3s;
overflow:auto;
background-color:#ffffff;
}

/* ==================================
========== <div > Icons made by <a href="https://www.flaticon.com/authors/yannick" title="Yannick" > Yannick</a > from <a href="https://www.flaticon.com/" title="Flaticon" > www.flaticon.com</a > is licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" target="_blank" > CC 3.0 BY</a > </div > ===========
================================== */

/* ==================================
========== Nav Bar ===========
================================== */

/* This gives an ugly bottom border to a tags */
/*a:hover {
  border-color: #002B5C;
  border-bottom-style: solid;
  border-width: thick;
  padding-bottom: 5px;
}*/

@media only screen and (min-width:450px) {
  logo.svg {
    width: 60%;
  }
}

.navbar {
  padding: 20px 10px;
  background: #fff;
  border: none;
  border-radius: 0;
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
}

/* collapse function -- user general/acct holder info */

#myDIV {
  transform-origin: top;
  transition: 0.5s;
}

div.collapse {
  transform: perspective(100px) rotateX(0deg);
}

.updateuserinfo {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
}

.d-flex.align-items-center.order-12 {
  text-decoration-color: #ffffff;
}

#content {
  width: 100%;
  padding-top: 30px;
  transition: all 0.3s;
  height: 100%;
  min-height: 100%;
  padding-bottom: 100px;
  background-color: #f8f9fc;
}

#content2 {
  width: 100%;
  padding: 30px;
  transition: all 0.3s;
  height: 100%;
  min-height: 100%;
  /*padding-bottom: 100px;*/
  background-color: #f8f9fc;
}

#rename {
  width: 100%;
  transition: all 0.3s;
  overflow: auto;
  background-color: #ffffff;
}

#select {
  width: 100%;
  transition: all 0.3s;
overflow: auto;
	background-color: #ffffff;
}

#updatepayment {
  width: 100%;
  padding: 20px;
  transition: all 0.3s;
  overflow: auto;
  background-color: #ffffff;
}

#save {
  width: 100%;
  transition: all 0.3s;
  overflow: auto;
}

#savesettings {
  width: 100%;
  transition: all 0.3s;
  overflow: auto;
}

#process {
  width: 100%;
  padding: 30px;
  transition: all 0.3s;
  height: 100%;
  min-height: 100%;
  overflow: auto;
  padding-bottom: 100px;
  background-color: #ffffff;
}

#inviteuser {
  width: 100%;
  padding: 30px;
  transition: all 0.3s;
  overflow: auto;
  background-color: #ffffff;
}

#addnewuser {
  width: 100%;
  padding: 30px;
  transition: all 0.3s;
  overflow: auto;
  background-color: #ffffff;
}

#addnewdevice {
}

#guestcode {
  width: 100%;
  padding: 10px;
  transition: all 0.3s;
  overflow: auto;
  padding-bottom: 10px;
  background-color: #ffffff;
}

#contactus {
  padding: 10px;
  padding-bottom: 60px;
}

#search {
  width: 100%;
  transition: all 0.3s;
  height: auto;
  overflow: auto;
  padding-bottom: 10px;
  background-color: #ffffff;
}

#forgotpass2 {
  width: 100%;
  padding: 30px;
  transition: all 0.3s;
  height: 100%;
  min-height: 100%;
  overflow: auto;
  padding-bottom: 100px;
  background-color: #ffffff;
}

#container {
  min-height: 100%;
  position: relative;
  color: rgb(248,249,252);
}

#groupsearch {
  width: 100%;
  padding: 30px;
  transition: all 0.3s;
  height: 100%;
  min-height: 100%;
  overflow: auto;
  padding-bottom: 100px;
  background-color: #ffffff;
}

/* ==================================
=========== content style ============
================================== */

.container.user {
  width: 100%;
  max-width: 1800px;
}

body {
  margin: 0;
  overflow-x: hidden;
  font-family: 'Open Sans', sans-serif;
  font-family: Open-Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #858796;
  text-align: left;
  /*background-color: #fff;*/
}

.card-header.py-3 {
  background-color: #ffffff;
  width: 100%;
}

.row {
  justify-content: center;
}

.contact-clean {
  padding-bottom: 60px;
}

html, body {
  height: 100%;
  background-color: #f8f9fc;
}

#wrapper {
  /*overflow: hidden;*/
  /*padding-bottom: 0;*/
  /*min-height: 80%;*/
  position: relative;
}

.card-group {
  border-style: none;
  background-color: #f8f9fc;
  border: none;
}

.fas {
  font-size: 22px;
}

.col, .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col-auto, .col-lg, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-auto, .col-md, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md-auto, .col-sm, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-auto {
  position: relative;
  width: 100%;
  padding-right: .75rem;
  padding-left: .75rem;
}

@media (min-width:992px) {
  .col-lg-6 {
    flex: 0 0 50%;
    max-width: 50%;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
  }
}

.col-sm-3 {
  position: relative;
  width: 100%;
  padding-right: .75rem;
  padding-left: .75rem;
}

html {
  font-family: sans-serif;
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}

@media (min-width:1200px) {
  .col-xl-3 {
    flex: 0 0 33.33333%;
    max-width: 33%;
  }
}

/* ==================================
============  Footer  ============
================================== */

/*footer h3 {
  font-size: 12pt;
}

footer p {
  font-size: 9pt;
}

footer ul {
  list-style: none;
  width: 100px;
}

footer a {
  text-decoration: none;
}

#footerNav, #footerSupport, #footerContact {
  float: left;
  width: 200px;
  padding-top: 15px;
}

#footerNav {
  font-size: 12pt;
}

footer {
    padding-top: 10px;
}

footer h3 {
    font-size: 12pt;
}

footer p {
    font-size: 9pt;
}

footer ul {
    list-style: none;
    width: 100px;
}

footer {
    width: 100%;
    background-color: #C0C0C0;
}

#footerSect {
    width: 900px;
    margin: auto;
}

footer h3 {
    font-size: 12pt;
}


footer p {
    font-size: 9pt;
}*/

#copyright {
  font-size: 8pt;
}

.bg {
  width: 700px;
  margin: auto;
  padding: 30px 30px 30px 50px;
}

a {
  background-color: inherit;
}

#logo:hover {
  border-bottom-style: none;
}

p {
  /*width: 50%;*/
  margin: auto;
  padding-top: 10px;
}

.btn-primary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle {
  color: #fff;
  background-color: grey;
  border-color: grey;
  transition: .3s transform ease-in-out;
}

.card-header py-3 {
  transition: .3s transform ease-in-out;
}

.d-sm-flex.justify-content-between.align-items-center.mb-4 {
  position: absolute;
  top: 50%;
  left: 50%;
  font-size: 100%;
}

.container, .container-fluid[aria-expanded="false"]:before {
  content: "[view more]";
}

.container, .container-fluid[aria-expanded="true"]:before {
  content: "[view less]";
}

.respons {
  width: 90%;
  height: auto;
  display: block;
}

#container.user .col-sm-auto {
  width: 100% !important;
  padding-right: 75rem !important;
  padding-left: 75rem !important;
}

.col-form2 {
  max-width: 600px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.d-flex {
  display: flex!important;
}

.flex-column {
  flex-direction: column!important;
}


li {
  padding-bottom: 15px;
}


.table-responsive {
  width: 100%;
}

.table-responsive {
  width: 100%;
}

.popup_calendar > div {
    top: 0 !important;
    left: 0px !important;
    position: absolute;
}

.invitelogcal > div {
    left: -100px !important;
}

.popup_calendar {
    position: relative;
}

.popup_calendar > td, .popup_calendar > th {
    padding: 0.75rem;
}

/* Sticky footer fix: footer has a fixed height of 140px, which is specified in footer.css */
.push-footer-to-bottom {
    min-height: calc(100vh - 140px);
}