html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

@font-face {
    font-family: Myriad-Pro-Regular;
    src: url("../fonts/MYRIADPRO-REGULAR.woff");
}
@font-face {
    font-family: Myriad-Pro-Bold;
    src: url("../fonts/MYRIADPRO-BOLD.woff");
}
@font-face {
    font-family: Myriad-Pro-Semibold;
    src: url("../fonts/MYRIADPRO-SEMIBOLD.woff");
}
:root{

 --blue: rgb(84,158,211);
 --lightblue2: #ecf8f8;
 --purple: rgb(155,71,149);
 --green: rgb(67,188,186);
 --grey: rgb(62,63,63);
 --lightGrey: #a3a9ad;
 --red: rgb(221,85,93);
 --yellow: rgb(234,181,46);
 --turquoise:#43bcba;
 --lightBlue: #559ed3;
 --lightGreen:#8be599;
 --lightRed: #dd555d;
 --lightYellow: #ffbf00;
 -grad1: linear-gradient(to right, var(--purple) 0%,var(--blue) 35%, var(--green) 60%);
}
.red-outline{
    border: 2px solid #dc545c;
border-radius: 15px;
padding: 20px;
}

.text-turquoise{color:var(--turquoise)}
.searchW25 input{width:25vw;}
.btn-turquoise {
    color: #fff;
    background-color: var(--turquoise);
    border-color: var(--turquoise);
}
.btn-turquoise:hover {
    color: #fff;
    background-color: #328d8b;
    border-color: #328d8b;
}
.w-50px{width:40px}

*{font-family:"Myriad-Pro-Regular";}
body{font-family:"Myriad-Pro-Regular";}

.srix-regular{font-family: Myriad-Pro-Regular;}
.srix-semibold{font-family: Myriad-Pro-Semibold;}
.srix-bold{font-family: Myriad-Pro-Bold;}

.fs-12{font-size: 0.6vw !important;}
.fs-13{font-size: 0.7vw !important;}
.fs-14{font-size: 14px !important;}
.fs-15{font-size: 15px !important;}

.grid{display: grid;}
.gafc{grid-auto-flow: column;}

.gtc2-1fr{grid-template-columns: 1fr 1fr;}


/*rows grids*/
.gtr-1{grid-template-rows:repeat(1,1fr)}
.gtr-2{grid-template-rows:repeat(2,1fr)}
.gtr-3{grid-template-rows:repeat(3,1fr)}
.gtr-4{grid-template-rows:repeat(4,1fr)}
.gtr-5{grid-template-rows:repeat(5,1fr)}
.gtr-6{grid-template-rows:repeat(6,1fr)}
.gtr-7{grid-template-rows:repeat(7,1fr)}
.gtr-8{grid-template-rows:repeat(8,1fr)}
.gtr-9{grid-template-rows:repeat(9,1fr)}
.gtr-10{grid-template-rows:repeat(10,1fr)}
.gtr-11{grid-template-rows:repeat(11,1fr)}
.gtr-12{grid-template-rows:repeat(12,1fr)}
/*rows grids*/
.gtc-1{grid-template-columns:repeat(1,1fr)}
.gtc-2{grid-template-columns:repeat(2,1fr)}
.gtc-3{grid-template-columns:repeat(3,1fr)}
.gtc-4{grid-template-columns:repeat(4,1fr)}
.gtc-5{grid-template-columns:repeat(5,1fr)}
.gtc-6{grid-template-columns:repeat(6,1fr)}
.gtc-7{grid-template-columns:repeat(7,1fr)}
.gtc-8{grid-template-columns:repeat(8,1fr)}
.gtc-9{grid-template-columns:repeat(9,1fr)}
.gtc-10{grid-template-columns:repeat(10,1fr)}
.gtc-11{grid-template-columns:repeat(11,1fr)}
.gtc-12{grid-template-columns:repeat(12,1fr)}

.gafr{grid-auto-flow: row;}

/*row end*/

.jcc{justify-content: center;}
.jcs{justify-content: start;}
.jcfe{justify-content: flex-end;}
.jic{justify-items: center;}
.jis{justify-items: start;}
.jcsb{justify-content: space-between;}
.jsl{justify-self: left;}
.jse{justify-self: end;}

.acc{align-content: center;}
.acs{align-content: start;}
.ace{align-content: flex-end;}
.aic{align-items: center;}
.ais{align-items: start;}
.aie{align-items: flex-end;}
.aifs{align-items: flex-start;}

.asc{align-self: center;}

.r-gap1{row-gap: 10px;}
.r-gap2{row-gap: 20px;}
.r-gap3{row-gap: 30px;}
.r-gap4{row-gap: 40px;}
.r-gap5{row-gap: 50px;}
.r-gap6{row-gap: 60px;}
.r-gap7{row-gap: 70px;}
.r-gap8{row-gap: 80px;}
.r-gap9{row-gap: 90px;}
.r-gap10{row-gap: 100px;}
.r-gap11{row-gap: 110px;}
.r-gap12{row-gap: 120px;}

.c-gap1{column-gap: 10px;}
.c-gap2{column-gap: 20px;}
.c-gap3{column-gap: 30px;}
.c-gap4{column-gap: 40px;}
.c-gap5{column-gap: 50px;}
.c-gap6{column-gap: 60px;}
.c-gap7{column-gap: 70px;}
.c-gap8{column-gap: 80px;}
.c-gap9{column-gap: 90px;}
.c-gap10{column-gap: 100px;}
.c-gap11{column-gap: 110px;}
.c-gap12{column-gap: 120px;}

.plr-1{padding:0px 10px}
.plr-2{padding:0px 20px}
.plr-3{padding:0px 30px}
.plr-4{padding:0px 40px}
.plr-5{padding:0px 50px}
.plr-6{padding:0px 60px}
.plr-7{padding:0px 70px}
.plr-8{padding:0px 80px}
.plr-9{padding:0px 90px}
.plr-10{padding:0px 100px}


.text-12{font-size: 12px;}
.text-13{font-size: 13px;}
.text-14{font-size: 14px;}

.scroll-box{
    overflow-y: scroll;
    scrollbar-width: thin;
    padding-right:30px;
    padding-top:10px;
    padding-bottom:10px;
}

.height-1{height:10vh}
.height-2{height:20vh}
.height-3{height:30vh}
.height-4{height:40vh}
.height-5{height:50vh}
.height-6{height:60vh}
.height-7{height:70vh}
.height-8{height:80vh}
.height-9{height:90vh}
.height-10{height:100vh}

.gtc-2{grid-template-columns: 1fr 1fr;}

.greenOutlineBtn {
    background-color: rgb(255, 255, 255);
    font-weight: bold;
    color: black;
    width: 50%;
    font-size: 12px;
    border: 1px solid var(--green);
}

.bg-red{background-color: var(--lightRed);}
.bg-green{background-color: var(--lightGreen);}
.bg-blue{background-color: var(--lightBlue);}
.bg-turqoise{background-color: #43bcba;}

.greenBtn {
    background-color: var(--green);
    font-weight: bold;
    color: white;
    width: 50%;
    font-size: 12px;
    height:35px;
}
/*The Login*/

.srix-login-wrapper{
    width: 100%;
    height:90vh;
    display: grid;
    grid-auto-flow: column;
    align-items: center;
    justify-items: center;
}

.srix-login-1{
    display: grid;
    align-content: space-around;
    height: 100%;
}

.srix-login-2{
    display: grid;
    width:65%;
    height: 950px;
    background-image: linear-gradient(180deg, rgba(84,158,211) 0%, rgba(67,188,186) 100%);
    border-radius: 15px;
    padding:0px 80px;
    align-content: space-around;
}
.srix-login-2 h4{color: white;font-size: 3em;font-weight:bold;font-family:"Myriad-Pro-Bold";}
.srix-login-2 .form-label{color: white;font-size: 16px;}
.srix-login-2 input{
    background: transparent;
    border: none;
    border-bottom: 2px solid white;
    margin-bottom: 10px;
}

[type="text"]:focus,[type="password"]:focus,textarea:focus,textarea{
    outline: 2px solid transparent;
    outline-offset: 2px;
    --tw-ring-inset: var(--tw-empty, );
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: white;
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
    border-color: white;
    background-color: #ffffff4d;
}

#hearAboutMsg{
    color: white;
    border: none;
    resize: none;
    background-image: linear-gradient(180deg, rgba(84,158,211) 0%, rgba(67,188,186) 100%);
}

#hearAboutMsg::-webkit-input-placeholder {
    color: white;
  }

  #hearAboutMsg:-moz-placeholder { /* Firefox 18- */
    color: white;
  }

  #hearAboutMsg::-moz-placeholder {  /* Firefox 19+ */
    color: white;
  }

  #hearAboutMsg:-ms-input-placeholder {
    color: white;
  }

  #hearAboutMsg::placeholder {
    color: white;
  }

  .srix-login-wrapper .theLoginBtn{width:200px}

#theRolesSectionWrap{
display: grid;
margin-top: 30px;
grid-template-columns: repeat(4,1fr);
}

.trsw-box{
    width: 90%;
    height: 91px;
    background-color: transparent;
    border: 1px solid white;
    border-radius: 10px;
    margin-bottom: 15px;
    display: grid;
    justify-items: center;
    align-content: center;
}

.trsw-box-active{border: 3px solid #ffc107;}

.trsw-box input[type="radio"] {
    display: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
  }
.trsw-box input[type="radio"]:checked {
    display: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
  }

/*The Login & Register*/


/*The Loading Circle*/
.srix-loadingScreen-wrapper{
    width: 100%;
height: 90vh;
display: grid;
grid-auto-flow: column;
align-items: center;
justify-items: center;
grid-template-columns: 1fr 1fr 1fr;
}
#srix-loadingCircleGrid{
    width: auto;
    display: grid;
    justify-content: start;
    align-content: space-around;
    grid-template-rows: 58px 80px 100px auto;
    margin-left: -42%;
}
#srix-theLine{
    width:2px;
    height:80%;
    background-color: lightgrey;
}

#srix-loadingCircleGrid h1, #srix-loadingCircleGrid small{
    margin-left:-25px;
    text-align:center;
}
.circular{
  height: 100px;
  width: 100px;
  position: relative;
  transform: scale(4);
}
.circular .inner, .circular .outer, .circular .circle{
  position: absolute;
  z-index: 6;
  height: 100%;
  width: 100%;
  border-radius: 100%;
  box-shadow: inset 0 1px 0 rgba(0,0,0,0.2);
}
.circular .inner{
    top: 50%;
    left: 50%;
    height: 90px;
    width: 90px;
    margin: -45px 0 0 -45px;
    background-color: white;
    border-radius: 100%;
    box-shadow: 0 1px 0 rgba(0,0,0,0.2);
}
.circular .circle{
  z-index: 1;
  box-shadow: none;
}
.circular .numb{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 10;
  font-size: 12px;
  font-weight: 500;
  color: black;
}
.circular .bar{
  position: absolute;
  height: 100%;
  width: 100%;
  background: #fff;
  -webkit-border-radius: 100%;
  clip: rect(0px, 100px, 100px, 50px);
}
.circle .bar .progress{
  position: absolute;
  height: 100%;
  width: 100%;
  -webkit-border-radius: 100%;
  clip: rect(0px, 50px, 100px, 0px);
}
.circle .bar .progress, .dot span{

}
.circle .left .progress{
  z-index: 1;
  animation: left 4s linear both;
  background:linear-gradient(180deg, #8e62c0 0%, rgba(67,188,186) 100%);
}
@keyframes left {
  100%{
    transform: rotate(180deg);
  }
}
.circle .right{
  z-index: 3;
  transform: rotate(180deg);
}
.circle .right .progress{
  animation: right 4s linear both;

  background:linear-gradient(180deg, rgba(67,188,186) 0%, #8e62c0 100%);
}
@keyframes right {
  100%{
    transform: rotate(180deg);
  }
}
.circle .dot{
  z-index: 2;
  position: absolute;
  left: 50%;
  top: 50%;
  width: 50%;
  height: 10px;
  margin-top: -5px;
  animation: dot 8s linear both;
  transform-origin: 0% 50%;
}
.circle .dot span {
  position: absolute;
  right: 0;
  width: 10px;
  height: 10px;
  border-radius: 100%;
}
@keyframes dot{
  0% {
    transform: rotate(-90deg);
  }
  50% {
    transform: rotate(90deg);
    z-index: 4;
  }
  100% {
    transform: rotate(270deg);
    z-index: 4;
  }
}
/*The Loading Circle*/

/*Customer Dashboard*/
.grid{display: grid;}
.gafc{grid-auto-flow: column;}
.jcs{justify-content: start;}
.jcc{justify-content: center;}
.jsc{justify-self: center;}
.jib{justify-items:baseline;}
.acs{align-content: start;}
.aic{align-items: center;}

.cgap-1 { column-gap: 10px;}
.cgap-2 { column-gap: 20px;}
.cgap-3 { column-gap: 30px;}
.cgap-4 { column-gap: 40px;}
.cgap-5 { column-gap: 50px;}
.cgap-6 { column-gap: 60px;}
.cgap-7 { column-gap: 70px;}
.cgap-8 { column-gap: 80px;}
.cgap-9 { column-gap: 90px;}
.cgap-10{  column-gap: 100px;}
.cgap-11{  column-gap: 110px;}
.cgap-12{  column-gap: 120px;}

.rgap-1 { row-gap: 10px;}
.rgap-2 { row-gap: 20px;}
.rgap-3 { row-gap: 30px;}
.rgap-4 { row-gap: 40px;}
.rgap-5 { row-gap: 50px;}
.rgap-6 { row-gap: 60px;}
.rgap-7 { row-gap: 70px;}
.rgap-8 { row-gap: 80px;}
.rgap-9 { row-gap: 90px;}
.rgap-10{ row-gap: 100px;}
.rgap-11{ row-gap: 110px;}
.rgap-12{ row-gap: 120px;}

.srix-w-40{width: 40%;}
.srix-w-50{width: 50%;}
.srix-w-60{width: 60%;}
.srix-w-70{width: 70%;}
.srix-w-80{width: 80%;}

/*Common ends above*/

#mainGridWrapper{
    display: grid;
    grid-template-columns: 2fr 10fr;
    width:100%;
    height:100%;
}

.theMainUserSidebar{
    width:100%;
    /*height: 100vh;*/
    color: white;
    display: grid;
    row-gap: 30px;
    background: linear-gradient(112deg, rgba(67,188,186) 0%, #8e62c0 100%);
    /*overflow-y: scroll;*/
scrollbar-width: thin;
}
.theMainUserSidebar h5{ font-family: Myriad-Pro-Semibold;}
.profilePicture{border-radius: 50%;width: 50px;height: 50px;}

.yellowBlackBtn{
    background-color: rgba(234, 181, 46);
    font-weight: bold;
    color:black;
    width:50%;
    font-size: 12px;
}

.LinksSection{
    display: grid;
    row-gap: 45px;
    padding-left:20%;
}
.LinksSection .grid{
    cursor: pointer;
}

.LinksSection a{
    text-decoration: none;
    color: white;
    font-size: 14px;
}
.LinksSection a:hover{
    color: whitesmoke;
}
.theTransparentBox {
    box-shadow: 0 1rem 3rem rgba(0,0,0,.175) !important;
    display: grid;
    align-content: space-between;
    justify-items: center;
    padding: 30px;
    border-radius: 10px;
    height: 112px;
    width: 80%;
    justify-self: center;
}
.theTransparentBox small{font-size: 14px;}
.theTransparentBox h4{
    font-family: Myriad-Pro-Bold;
    font-size: 22px;
    font-weight: bolder;
    color:black
}

#userDash-g3{
    display: grid;
    grid-template-columns: 8fr 2fr;
    padding:40px 30px 10px 60px;
}

#userDash-g4{
    display: grid;
    justify-content: start;
    align-content: start;
}
.circle-green,.circle-yellow,.circle-red{
    width:10px;
    height: 10px;
    background-color: green;
    border-radius: 50%;
}
.circle-yellow{background-color: var(--lightYellow);}
.circle-red{background-color: var(--lightRed);}
#userDash-g4 h4{
    font-size: 25px;
}

.srix-boothCard-wrapper {
    /* height: 230px !important;
    width: 265px !important;
    display: grid !important;
    grid-template-rows: 4fr 2fr !important;
    border-radius: 10px !important; */
    height: 24vh !important;
    width: 17vw !important;
    display: grid !important;
    grid-template-rows: 4fr 2fr !important;
    border-radius: 10px !important;
}
.srix-bc-img.grid {
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.srix-bc-actions-row {
    display: grid;
    grid-template-columns: 20% 60% 20%;
    justify-items: center;
}

.srix-delete-btn{
    background-color: var(--green);
    width:30px;
    height: 30px;
    display: grid;
    justify-content: center;
    align-content: center;
}
.srix-share-btn{
    background-color: var(--purple);
    width:30px;
    height: 30px;
    display: grid;
    justify-content: center;
    align-content: center;
}
#keyCard{
    width: 200px;
    height: 250px;
    background-color: #ddecf6;
    border-radius: 25px;
    display: grid;
    padding: 20px;
    justify-items: center;
    align-items: center;
}

#keyCard div {
    width: 105px;
}
/*Customer Dashboard*/

/*Create Booth*/
#createBooth1-g3{
    display: grid;
align-content: start;
padding: 20px 50px;
height: 100vh;
overflow-y: scroll;
scrollbar-width: thin;
}

#srix-theProgressBar{
    height: 1.5rem;
    border-radius: 15px;
}
#srix-theProgressBar .progress-bar{
    background-image: linear-gradient(to right, var(--purple) 0%,var(--blue) 35%, var(--green) 60%);
}

.srix-createBooth-blueCards{
    width: 100%;
    height:100%;
    display: grid;
    justify-items:center;
    align-content: flex-start;
    row-gap: 30px;
    padding:10vh 0px;
    background-color: var(--lightBlue);
    border-radius: 14px;
}

.numCircle{
    display: grid;
    justify-items: center;
    align-items: center;
    width: 50px;
    height: 50px;
    background-color: white;
    color:var(--purple);
    text-align: center;
    border-radius: 50%;
    font-size: 25px;
    font-weight: bolder;
}

.blueC-text{
    color: white;
    text-align: center;
    width:80%;
}

.carousel-indicators{
bottom: -80px;
}

.carousel-indicators [data-bs-target] {
    width: 30px;
    height: 30px;
    background-color: lightgrey;
    border-radius: 100%;
}
.carousel-indicators .active {
    opacity: 1;
    background-color: var(--green);
}

.srix-form{
    border-color: black;
    border-top: 0px;
    border-right: 0px;
    border-left: 0px;
    border-radius: 0px;
}
.srix-form:focus{
    outline: none;
    border-color: black;
    border-top: 0px;
    border-right: 0px;
    border-left: 0px;
}
.srix-upload-btn-1{
    background-color: var(--lightBlue);
    width: 100px;
    height: 100px;
    border-radius: 24px;
}

#boothNameLogoFormWrap textarea{resize: none;width:50%;height:30vh}
/*Create Booth*/

/*Stand Package*/
.srix-sp-gridBox-wrapper{
    display: grid;
    grid-auto-flow: column;
}

.srix-sp-gridBox{
    background-color: var(--lightblue2);
    width: 300px;
    /* justify-self: center; */
    height: 345px;
    border-radius: 9px;
    display: grid;
    justify-items: center;
    align-content: space-evenly;
    font-size: 26px;
}

.srix-sp-gridBox-wrapper .active{
    background-color: var(--blue);
    color: white;
    border:3px solid var(--lightYellow);
}

#requestCustomShapeBtn{
    width: 400px;
    margin-top: 119px;
    height: 100px;
    border: 4px solid var(--red);
    font-size: 18px;
    font-weight: normal;
    color: white;
    display: grid;
    grid-auto-flow: column;
    align-content: center;
    align-items: center;
    justify-content: space-around;
}
/*Stand shape*/

/*Stand Package*/
.srix-blueHorizonBox{
    display: grid;
    grid-auto-flow: column;
    background-color: var(--lightblue2);
    color: black;
    width: 550px;
    height: 200px;
    align-items: center;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
    padding-left: 20px;
}
.srix-blueHorizonBox-wrapper .active{
    border:4px solid var(--lightYellow);
    background-color: var(--lightBlue);
    color: white;
}
.srix-blueHorizonBox img{
    margin-right: -244px;
    -webkit-user-select:none
}

.srix-blueHorizonBox-wrapper label{line-height: 23px;}
#requestCustomBooth input[type="text"]:focus{
    color: #212529;
    background-color: #fff;
    border-color: #86b7fe;
    outline: 0;
    box-shadow: 0 0 0 .25rem rgba(13,110,253,.25);
}

#requestCustomBooth input,#requestCustomBooth textarea
{background-color: rgb(224, 224, 224);}

.srix-grid-layout-1{
    display: grid;
    grid-template-columns: 3fr 9fr;
    column-gap: 50px;
}
/*Stand Package*/

/*Flooring*/
.flooring-g3 iframe,.graphics-g3 iframe{
    width: 100%;
    height: 50vh;
    border: none;
    border-radius: 15px;
    border:1px solid white
}
.graphics-g3 iframe{height:70vh}
.cart-small-btn{
    border:2px solid var(--green);
    border-radius: 15px;
    column-gap: 20px;
    padding: 10px;
    width:170px;
    justify-self: end;
}

.cart-small-btn span{
    font-weight: bold;
    color: var(--lightRed);
}

.flooring-g3 ul li{
    display: grid;
    grid-auto-flow: column;
    column-gap: 10px;
    align-items: start;
    align-content: start;
    justify-content: start;
}

.liCircle1{
    border-radius: 100%;
    background-color:var(--turquoise);
    width: 12px;
    height:12px;
}

.flooring-tile, .furniture-tile{
    height: 80px;
    width: 80px;
    display: grid;
}


.flooring-tile img, .flooring-tile span{position: fixed;}

.srix-flooring-wooden-wrap {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    row-gap: 50px;
    justify-items: center;
    align-items: center;
}

.flooring-g6 .carousel-indicators {
    bottom: 0px;
}
.flooring-g6 .carousel-indicators [data-bs-target] {
    width: 15px;
    height: 15px;
    background-color: lightgrey;
    border-radius: 100%;
}

.flooring-g6 .carousel-indicators .active {
    opacity: 1;
    background-color: var(--green);
}
.flooring-g6 .activeTile{
    border:4px solid var(--green);
}

.healthSafetyOverflow{
    overflow-y: scroll;
    scrollbar-width: thin;
    height: 170px;
    border-bottom: 19px solid #f8f9fa;
}
/*Flooring*/

/*Walling*/
.doorAndWall{
    display: grid;
    grid-template-columns: 2fr 6fr;
    align-items: center;
    column-gap: 10px;
}
.doorAndWall div{
  padding: 10px;
  border: 3px solid var(--green);
}

.alert-danger{
    background-color: var(--red);
    color: white;
    border-radius: 15px;
}

.walling-g2 select{
    width: 170px;
border: 1px solid var(--green);
margin-top:10px;
}

.walling-g2 .form-select:focus {
    border-color: var(--blue);
    outline: 0;
    box-shadow: 0 0 0 .25rem rgb(182, 227, 226);
}
/*Walling*/

/*Graphics*/
.theradios .form-check {
    grid-template-columns: 1fr 1fr;
    padding-left: 0px;
}

#wallTab .form-check label{
    color:var(--blue);
    font-size: 12px;
    padding-left:10px;
}
#wallTab .form-check input:focus{border:1px solid var(--blue);}
#wallTab .form-check input{height:50px;}
/*Graphics*/

/*Furniture*/
.nav-pills .nav-link {background-color: #eef5fb;}
#pills-tab {
    row-gap: 10px;
    column-gap: 10px;
}

.srix-furniture-wooden-wrap {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    row-gap: 50px;
    justify-items: center;
    align-items: center;
    overflow-y: scroll;
    scrollbar-width: thin;
    height: 340px;
    align-content: start;
}

.furniture-tile.soldout span {
    position: relative;
    margin-top: -82px;
    border: 4px dashed red;
    width: 78px;
    height: 76px;
    text-align: center;
    color: white;
    align-self: center;
    justify-self: center;
    padding-top: 14px;
    font-size: 21px;
    font-weight: bold;
}
.furniture-tile.soldout img{filter: brightness(40%);}

.nav-pills .nav-link {
    background-color: var(--lightblue2);
    color: var(--lightGrey);
}
.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #fff;
    background-color:var(--green);
}
/*Furniture*/

/* Review Finalize  */
.reviewMainDiv{
    display: grid;
    grid-template-columns: 2.5fr 1fr;
    grid-gap: 15px;
    padding: 15px 0px;
}
.reviewSubDivOne{
    height: 225px;
    border: 1px solid #6bb0e2;
    margin: 20px 0px;
    border-radius: 11px;
}

.reviewFlooringText{
    padding: 15px;font-size:18px
}
.reviewCheckBoxDiv{
    padding: 10px 20px;
    color: #909090;
}
.reviewCheckBox{
    margin: 12px 0px;
    margin-right: 30px;
    color: #909090;
}
.gotoBtnMainDiv{
    display: grid;
    grid-template-columns: 80% 20%;
}
.gotoDivTwo{
    display: flex;
    justify-content: center;
}
.gotoSectionBtn{
    background-color: #43bcba;
    border: none;
    color: #fff;
    font-size: 14px;
    width: 100px;
    font-weight: 800;
}
.reviewPrice{
    display: flex;align-items: end;font-size: 20px;color: #f45c65;margin-left: 25px;font-weight: 800;
}

/*  */
.divTwoSub{
    height: 225px;
    /* border: 1px solid #6bb0e2; */
    margin: 20px 0px;
    border-radius: 11px;
}
.divTwo_2{
    display: grid;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-size: 14px;
    font-weight: 100;
    line-height: 19px;
}
.totalCost{
    height: 120px;background-color: #fcf8ec;display: grid;justify-content: center;align-items: center;border: 1px solid #f7dc8a;
    border-radius: 9px;width: 95%;
    margin: 0 auto;
}
.divTwo_3{
    margin: 0 !important;
    margin-top: -22px !important;
}
.totalCostText{
    font-size: 15px;
    font-weight: 800;
}
.issueDiv{
    padding: 25px 0px;
    display: grid;
    justify-content: center;
    align-items: center;
}
.issueText{
    color: #569fd3;
    font-size: 18px;
    letter-spacing: 1px;
}
.contactSpan{
    padding: 10px 0px;font-size: 13px;text-align: center;font-weight: 100;
}
.contactText{
    color: #43bcba;
    text-align: center;
    text-decoration: underline;font-size: 16px;font-weight: 800;
}
/*  */
.reviewFooterBtnsMainDiv{
    display: flex;
}
.reviewFooterBtn2Div{
    margin-left: 15px;
}
.reviewFooterBtns{
    border: none;
    padding: 12px;
    font-size: 14px;
    font-size: 14px;
    border-radius: 5px;
}
.reviewFooterBtn1{
    background-color: #ffbf00;
    width: 180px;
}
.reviewFooterBtn2{
    background-color: #43bcba;
    color: #fff;
    width: 120px;
}



/*Audio visual*/
#audioVisual-g1 .nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: var(--blue);
    background-color: transparent;
    border-bottom: 1px solid var(--blue);
    border-radius: 0px;
    width: 100%;
}

#audioVisual-g1 #pills-tab{
    display: grid;
    grid-template-columns:1fr 1fr;
}

#audioVisual-g1 .nav-pills .nav-link {
    background-color: transparent;
    color: var(--lightGrey);
    width: 100%;
}
#audioVisualGrid-2 .activeTile {
    border: 4px solid var(--green);
}
.theCustomUploadBtn2{
    border: 3px solid var(--green);
    padding: 6px;
}

.alert-danger, .alert-success, .alert-warning, .alert-info{
    color: black;
    text-align: center;
    height:100%;
    display: grid;
    align-content: center;
}

.alert-danger{background-color: #f5ccce;border:2px solid var(--red);}
.alert-success{border:2px solid var(--green);}
.alert-warning{border:2px solid var(--lightYellow);}
.btn-1{
    background-color: var(--green);
    color:white;
    width:100px;
}
.btn-1:hover{color: white;}
.btn-2{
    background-color: var(--lightblue2);
    color:black;
    width:100px;
}
/*Audio visual*/


.grid-container {
    display: grid;
    grid-gap: 50px;
    grid-template-columns: repeat(4,1fr);
    padding: 10px;
  }

  .grid-item {
    background-color: #549ed3;
    /* border: 1px solid rgba(0, 0, 0, 0.8); */
    display: grid;
    min-height: 15vh;
    color: white;
    align-items: center;
    /* width: 20vw; */
    padding: 20px;
    font-size: 30px;
    text-align: center;
  }

.grid-container-sub-Guidelines {
    background-color: #eef5fb;
    display: grid;
    grid-gap: 50px;
    grid-template-columns: repeat(1,1fr);
    padding: 41px;
  }

.grid-container-sub-Guidelines-image {
    background-color: #eef5fb;
    display: grid;
    grid-gap: 50px;
    grid-template-columns: repeat(2,1fr);
    padding: 41px;
  }

  .grid-item-sub-Guidelines {
    background-color: none;
    display: grid;
    min-height: auto;
    color: black;
    align-items: left;
    grid-template-columns: 1fr 9fr;
    font-size: 25px;
    text-align: left;
  }
  .guidelines_points_text{
    font-size: 20px;
    font-weight: 600 !important;
  }
  .guidelines_points_icon_image{
    filter: invert(74%) sepia(49%) saturate(636%) hue-rotate(1deg) brightness(91%) contrast(94%);
    align-self: start;
    margin-left: 1vw;
    margin-top: 0.5vh;
  }
  .grid-item-sub-Guidelines-buttons{
    background-color: none;
    display: grid;
    min-height: auto;
    color: black;
    align-items: left;
    grid-template-columns: 1fr 1fr;
    font-size: 25px;
    text-align: left;
  }
  .bluewhiteBtn{
    background-color: #43bcba;
    font-weight: bold;
    color: white;
    width: 25%;
    height: 56px;
    left: 0 !important;
    font-size: 24px;
}
  .redwhiteBtn{
    background-color: var(--red);
    font-weight: bold;
    color: white;
    width: 25%;
    height: 56px;
    left: 0 !important;
    font-size: 24px;
}

/*Traffic Light start */
#theSearchBarWrapp input{
    width:25vw
}



.bluewhiteBtnS{
    background-color: #43bcba;
    font-weight: bold;
    color: white;
    height: 36px;
    font-size: 12px;
}
#theTrafficLightBox{padding:10px 40px;}
#theTrafficLightBox h3{
 color: var(--blue);
 font-size: 26px;
 font-weight: 900;
}
#theTrafficLightBox .box-1 {
    width: 60%;
    display: grid;
    align-items: center;
    grid-template-columns: 1fr 1fr;
    justify-content: start;
    border-radius:15px;
}
#theTrafficLightBox .box-1 .bluewhiteBtnS{width:70%}
#theTrafficLightBox .box-1 img {width: 60%;padding:10px}
#theTrafficLightBox p{color:var(--lightGrey)}
#theTrafficLightBox .redWhiteBtn{background-color:var(--lightRed);color:white;padding:15px;width: 34%;font-size: 14px;}
#theTrafficLightBox  .yellowBlackBtn{height:40px;font-size:12px;width:30%}
#theTrafficLightBox textarea{background-color: rgb(236, 236, 236);height: 20%;}
/*Traffic Light end*/

/*CMS  Admin*/

    #cms-wrapper {
        padding: 10px 40px;
        width: 60%;
        background-color: white;
        padding:20px;
        margin-bottom: 200px;
        height:100%;
        padding-top: 44px;
    }


#cms-wrapper h3{
 color: var(--blue);
 font-size: 26px;
 font-weight: 900;
}
#cms-wrapper .box-1 {
    width: 60%;
    display: grid;
    align-items: center;
    grid-template-columns: 1fr 1fr;
    justify-content: start;
    border-radius:15px;
}
#cms-wrapper .box-1 .bluewhiteBtnS{width:70%}
#cms-wrapper .box-1 img {width: 60%;padding:10px}
#cms-wrapper p{color:var(--lightGrey)}
#cms-wrapper .redWhiteBtn{background-color:var(--lightRed);color:white;padding:10px;width: 34%;font-size: 14px;}
#cms-wrapper  .yellowBlackBtn{height:40px;font-size:12px;width:34%}
#cms-wrapper textarea{background-color: rgb(236, 236, 236);height: 20%;}

.backgroundImg{
    width:300px;
    height:200px;
    background-position: start;
    background-repeat: no-repeat;
    background-size: contain;
}

#theSearchBarWrapp img{cursor: pointer;}

/*CMS  Admin*/

.red-dot{
    width:15px;
    height: 15px;
    background-color:red;
    border-radius:15px;
}
.green-dot{
    width:15px;
    height: 15px;
    background-color:green;
    border-radius:15px;
}

.grid-3{display: grid;grid-template-columns: repeat(3,1fr);justify-content: start;}

.addQtWrap{padding-left: 45px;}
.addQtWrap .addQtBox .aqtTxt1{}
.addQtWrap .addQtBox .aqtTxt1{}


#srix-slider{
    width: 75vw;
    overflow-x: scroll;
    scrollbar-width: thin;
    padding: 13px;
    scrollbar-color: var(--green) #e3e3e3;
    margin-bottom: 30px;
}

#adminManageProjWrapper .amp2ndGrid{
    display: grid;
    height:  100%;
    width:   100%;
    border-radius: 10px;
    padding:30px;
}

#adminManageProjWrapper .amp2ndGrid h5{
    font-size: 20px;
    font-weight: bold;
    color:lightseagreen;
}

#adminManageProjWrapper .amp2ndGrid img{
    width:100%;
}

textarea{resize: none;scrollbar-width: thin;}

#ManageProjTable1{
height: 400px;
overflow-y: scroll;
scrollbar-width:thin;
scrollbar-color: var(--green) whitesmoke;
}

#ManageProjectsTabBtns .bluewhiteBtnS span{font-size: 14px;font-family:Arial, Helvetica, sans-serif;}

/*FLoor Plan Module*/
#floorPlanModule-g1{
    grid-template-columns: 4fr 8fr;
}

.srix-checkbox-seprate{
    display: grid;
    grid-auto-flow: column;
    justify-content: start;
    align-content: center;
    background-color: var(--lightblue2);
    padding: 21px;
    border-radius: 5px;
    line-height: 20px;
    column-gap:10px;
    width:300px;
    margin-bottom:15px;
}


.srix-checkbox-seprate .form-check-input{
    margin-left: -0.5em;
}


.floorModule-g2 select {
    width: 297px;
    border: 1px solid var(--green);
    margin-top: 10px;
}


.activeTile {
    border: 5px solid #43bcba;
}

.fpm-cards-grid{
    grid-template-columns: 1fr 1fr;
grid-gap: 10px;
height: 420px;
overflow-y: scroll;
scrollbar-width: thin;
padding:5px 0px 5px 5px;
}

.fpm-cards-grid .srix-boothCard-wrapper {
    height: 194px !important;
    width: 218px !important;
}

.floorPlanModule-g2 input:focus{
    border:1px solid var(--green);
}

.floorPlanModule-g3 iframe{
    width: 100%;
    height: 60vh;
    border: none;
    border-radius: 15px;
    border:1px solid white
}


#pricingMatrix-g2 input:focus{border:1px solid black}
#pricingMatrix-g2 {width: 286px;}

#pricingMatrix-g2 .form-group{grid-template-columns: 58px 1fr;}

#pricingMatrix-g2 input{
    background-color: var(--lightblue2);
}

#user-control-g1 .form-group{
margin-bottom: 50px;
}

#user-control-g1{
    height:600px;
}

#user-control-g2{
    display:grid;
    grid-template-columns: 34vw 1fr;

}

.srix-bc-icon{
    display: grid;
    grid-auto-flow: column;
    justify-content: space-between;
}

#user-control-g3{
    display:grid;
}

#user-control-g4{
    height: 55vh;
    overflow-y: scroll;
    scrollbar-width: thin;
    padding-right:10px;
}

#admin_msg_center-g1{
    background-color: #ddecf6;
    padding-left: 36px;
    border-radius: 5px;
}

#theGraphicsControlTable{
text-align: center;
}

#theGraphicsControlTable tr td{vertical-align: middle;}

#theVenueBoxOne {
    background-color: var(--lightblue2);
    padding: 20px;
    border-radius: 12px;
    width: 100%;
    display: grid;
    grid-auto-flow: column;
    column-gap: 46px;
}

#venue-wrap-2{
    grid-template-columns: 1fr 1fr 1fr;
    justify-content: start;
    align-items: center;
    width: 50%;
    margin-top: 50px;
    column-gap: 12px;
    row-gap: 20px;
    cursor: pointer;
}
.venue-box-item {
    background-color: var(--green);
    padding: 10px 15px;
    display: grid;
    grid-auto-flow: column;
    justify-content: start;
    column-gap: 20px;
    align-items: center;
    font-size:15px;
    color:white;
    font-weight: bold;
}
.food-court-box {
    display: grid;
    grid-auto-flow: column;
    /* align-items: center; */
    justify-content: start;
    column-gap: 30px;
    background-color: var(--lightblue2);
    width: 52%;
    padding-right: 35px;
    margin-bottom: 50px;
}
.food-court-box-content{
    display: grid;
    align-content: space-around;
}
.smallBlueHeading {
    color: var(--blue);
}

#ubc-grid2{
    width: 40vw;
    height: 70vh;
    justify-content: start;
    align-content: center;
    padding: 44px;
}

.sp-container.sp-light.sp-flat.sp-alpha-enabled.sp-clear-enabled.sp-palette-buttons-disabled.sp-palette-disabled.sp-initial-disabled {
    width: 232px;
}

.textDecNone{
    text-decoration: none;
}

#srix-events-card-list{
    grid-template-columns: 1fr 1fr 1fr 1fr;
    row-gap: 50px;
    overflow-x: unset;
}

#srix-events-card-list .text-turquoise{
    font-size: 1vw;
}
