﻿/* Move down content because we have a fixed navbar that is 50px tall */
body {
    padding-top: 50px;
    padding-bottom: 20px;
}

/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
    min-height:100vh;
}

/* Set widths on the form inputs since otherwise they're 100% wide */
/*input,
select,
textarea {
    max-width: 280px;
}*/

/* Responsive: Portrait tablets and up */
@media screen and (min-width: 768px) {
    .jumbotron {
        margin-top: 20px;
    }
    .body-content {
        padding: 0;
    }
}

.headerTitle {
    color: #1C2443;
}

.headerTitleIcon{
    color:gray;
}

.signinerror{
    text-align:left !important;
}

.myjumbotron{
    background-image: url('../../Assests/img/mainimage.png')  !important;
    /*background-position: 0% 25%;*/
    background-size: cover;
    background-repeat: no-repeat;
    width:99vw;
    height:60vh;
    /*filter: brightness(60%);*/
    position:absolute;
    left:0px;
     top: 0;
}


.mainImage{
    position: absolute;
    background-image:url('../../Assests/img/mainimage.png');
    background-repeat:no-repeat;
    background-size: cover;
    /*background-position: -200px -20px;*/
    width:100vw;
    height: 60vh;
    left: 0;
    top: 30px;
}

.mainImage span{
    position: absolute;
    left: 5vw;
    top: 50vh;
    z-index: 2;
    color:white;
    font-size:50px;
}

.mainImage h1{
    position: absolute;
    left: 40vw;
    top: 20vh;
    z-index: 2;
    color:white;
    font-size:40px;
}

.mainImage span h3{
    z-index: 2;
    color:white;
    font-size:20px;
}

.mainRow a{
    left: 100px ;
}

.mainRow{
    position: absolute;
    top: 62vh;
    width:90vw;
    left: 20px ;
    /*margin-right: auto ;*/
}

i.service-icon {
  /*border: 3px solid gray;
  border-radius: 50%;*/
  display: inline-block;
  font-size: 36px;
  width: 70px;
  height: 70px;
  line-height: 100px;
  vertical-align: middle; 
  text-align: center;

}

.gray {
    color: gray;
}

.licenseInput{
    width:500px !important;
}

.myCalendar
{
    background-color: white;
    border: solid 1px lightgray !important;
    border-radius: 5px;
}

.myCalendarDayHeader
{
 color:gray;
}

.myCalendarDay
{
 color:steelblue;
}

.alertKey {
   font-size:small;
}

.filtersPanel{
    width:340px !important;
}

.ticketsComments{
    width:500px !important;
}

.attachments{
    padding:30px 30px 30px 30px; 
    border:1px dashed gray;
}

.ticketHistoryGridDiv{
    padding:30px 30px 30px 30px; 
    /*border:1px dashed gray;*/
}

.alert-message-customers {
  margin:20px 0;
  padding:20px;
  border:3px solid #d9534f !important;
}

.alert-message {
  margin:20px 0;
  padding:20px;
  border-left:3px solid #eee;
}

.alert-message-danger {
  background-color:#fdf7f7;
  border-color:#d9534f;
}

.alert-message-info {
  background-color:#f4f8fa;
  border-color:#5bc0de;
}

.maintenance-alert{
  background-color:#fdf7f7;
  margin:20px 0;
  padding:20px;
  border:3px solid #d9534f !important;
}

.Qi {
    /*color: white;*/
    padding: 50px 0;
    margin-top: 90px;
    width: 100vw;
    margin-left: -15vw;
    background-color: #F4F6F7;
    /*  opacity:1;#6B8FA1  DFE4E8*/
}

.license-type-fixed{
  color:steelblue;
  font-weight:bold;
}

.license-type-floating{
   color:gray;
   font-weight:bold;
}

.btn_main {
    padding: 5px 10px 5px 10px;
    border-radius: 20px 20px 20px 20px;
    margin-top: 10px;
    text-decoration: none;
    font-size: 12px;
}

.btn_select {
    margin-top: -5px !important;
}


.btn_portal {
    background-color: white;
    color: #4682B4;
    border: solid #4682B4 1px;
}

.btn_portal:hover {
    background-color: #4682B4;
    color: white;
    border-color: #4682B4;
    text-decoration: none;
}

.btn_portal_red {
    background-color: white;
    color: red;
    border: solid red 1px;
}

.btn_portal_red:hover {
    background-color: lightgray;
    color: red;
    border: solid red 1px;
    text-decoration: none;
}


.btn_portal_red_close {
    background-color: red;
    color: white;
    border: solid red 1px;
}

.btn_portal_red_close:hover {
    background-color: white;
    color: red;
    border: solid red 1px;
    text-decoration: none;
}


.btn_portal_gray {
    background-color: white;
    color: black;
    border: solid lightgray 1px;
}

.btn_portal_gray:hover {
    background-color: lightgray;
    color: black;
    border: solid black 1px;
    text-decoration: none;
}

.btn_portal_green {
    background-color: white;
    color: mediumseagreen;
    border: solid mediumseagreen 1px;
}

.btn_portal_green:hover {
    background-color: mediumseagreen;
    color: white;
    border: solid mediumseagreen 1px;
    text-decoration: none;
}


.btn-wrapper {
    display: flex;
    justify-content: center;  /* Center the buttons horizontally */
    gap: 16px;                /* Space between buttons */
    flex-wrap: wrap;          /* Allow wrapping on small screens */
    text-align: center;
    margin-top: 10px;
}

/* Make both buttons the same width */
.btn-fixed-width {
    min-width: 350px;         /* Adjust as needed */
}
