
body{ margin:0px; padding:0px; overflow-x:hidden; background-color: #74cee4;width: 1200px; }
body.pan_boxed_img{ background-color: #74cee4; background-size: cover; background-attachment: fixed;width: 1200px; }
body.pan_boxed_pattern{ background-color: #74cee4; background-attachment: fixed;width: 1200px; }

.pan_site{ float: left; width: 100%; -webkit-transition: all 0.8s ease; -moz-transition: all 0.8s ease; -o-transition: all 0.8s ease; -ms-transition: all 0.8s ease; transition: all 0.8s ease; }
.pan_site > .pan_site_fullwidth{ float: left; width: 100%; background-color: #fff; }
.pan_site > .pan_site_boxed{ width:1200px; margin:auto; padding: 0px; background-color: #fff; top:0; }



.pan_section{ width: 100%; float: left; }


.topper {background-color: pink; margin: 0px;width: 1200px; }
.header {background-color: #f1f1f1; width: 1200px; }
.fooder {  padding: 20px;  text-align: center;}
.main {  padding: 0px;  margin-left: 10%;  margin-right: 10%;  width: 80%;}
.sticky { position: fixed; top: 0;width: 1200px; }
.sticky + .content {  padding-top: 350px;}

#navbar {  margin-top:0px;width: 1200px; }
#navbar ul { list-style:none; position:relative; float:left; margin:0; background-color: blue ;padding-left:12%;width: 88% }
#navbar ul a { display:block; color:#FFFFFF; text-decoration:none; font-weight:400; font-size:17px; line-height:30px; padding:5px 10px; font-family:'fontello',Arial,sans-serif }
#navbar ul li { position:relative; float:left; margin:0;  padding:0 ;}
#navbar ul li.current-menu-item { background:#C71585 }
#navbar ul li:hover { background:#0000CD }
#navbar ul ul { display:none; position:absolute; top:100%; left:0; background:#F08080; padding:0; min-width: 200px; }
#navbar ul ul li { float:none; min-width: 200px }
#navbar ul ul a { line-height:110%; padding:5px 5px }
#navbar ul ul ul { top:0; left:100% }
#navbar ul li:hover > ul { display:block }
#navbar ul .green { display:none; position:absolute; top:100%; left:0; background:#66CDAA; padding:0 }
#navbar ul .pink { display:none; position:absolute; top:100%; left:0; background:#B22222; padding:0 }
#navbar ul .brown { display:none; position:absolute; top:100%; left:0; background:#B22222; padding:0 }
#navbar ul .violet_deep { top:0; left:100%; background:#9400D3; padding:0 }
#navbar ul .violet_deep:hover { top:0; left:100%; background:#2E8B57; padding:0 }
/*arrow for sub-menu*/
#navbar .deep:after { content: '\ea76'; font-family: 'fontello'; margin-left:20px; font-size: 13px; }

form { width: 100%; margin: 10px auto;  padding: 5px;   border: 2px;
    border-radius: 10px;}
h2.form-title {    text-align: center;}
input {    display: block;    background-color: white;  width: 100%;    padding: 2px;}
form .form-group {    margin: 5px auto;}
form button {width: 100%; border: none; color: white;  background: #3b5998;    padding: 15px;
    border-radius: 5px;    font-size: 15px;}
.msg {    margin: 5px auto; border-radius: 5px;  text-align: left;  padding: 10px; text-decoration-color: red;}
input { font-family:Arial;   border: 1px solid black;  border-radius: 4px;    box-shadow: 0 1px #fff;    box-sizing: border-box;  color: #696969;  
  height: 30px;   margin: 0px 0 0 0px;   padding-left: 0px;   transition: box-shadow 0.3s;    width: 100%; }
 label{ font-family:Arial; font-size:15px; color:blue; width:100%;text-align: right;}
input[type="password"], input[type="textp"] {  border: 1px solid #a1a3a3;  border-radius: 4px;    box-shadow: 0 1px #fff;   box-sizing: border-box;  color: #696969;  
  height: 30px;   margin: 0px 0 0 0px;   padding-left: 0px;   transition: box-shadow 0.3s;   width: 100%; }

.row {  display: flex;  flex-wrap: wrap;  margin-right: -10px;  margin-left: -10px; border-width: 0px;}
.no-gutters {  margin-right: 0;  margin-left: 0; }
.no-gutters > .col,  .no-gutters > [class*="col-"] {    padding-right: 0;    padding-left: 0; }
.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,
.col-auto, .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,
.col-sm-auto, .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,
.col-md-auto, .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,
.col-lg-auto, .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,
.col-xl-auto {  width: 100%;  min-height: 1px;  padding-right: 5px;  padding-left: 5px;margin-top: 5px; border-width: 0px; }
.col {  flex-basis: 0;  flex-grow: 1;  max-width: 100%; }
.col-auto {  flex: 0 0 auto;  width: auto;  max-width: none; }
.col-1 {  flex: 0 0 8.33333%;  max-width: 8.33333%; }
.col-2 {  flex: 0 0 16.66667%;  max-width: 16.66667%; }
.col-3 {  flex: 0 0 25%;  max-width: 25%; }
.col-4 {  flex: 0 0 33.33333%;  max-width: 33.33333%; }
.col-5 {  flex: 0 0 41.66667%;  max-width: 41.66667%; }
.col-6 {  flex: 0 0 50%;  max-width: 50%; }
.col-7 {  flex: 0 0 58.33333%;  max-width: 58.33333%; }
.col-8 {  flex: 0 0 66.66667%;  max-width: 66.66667%; }
.col-9 {  flex: 0 0 75%;  max-width: 75%; }
.col-10 {  flex: 0 0 83.33333%;  max-width: 83.33333%; }
.col-11 {  flex: 0 0 91.66667%;  max-width: 91.66667%; }
.col-12 {  flex: 0 0 100%;  max-width: 100%; }

 .login {  background:#eceeee; border: 1px solid #42464b; border-radius: 6px; height: 100%; margin: 20px auto 0; width: 800px; box-shadow: inset 0px 1px 0px #2ab7ec, 0px 5px 0px 0px #497a78, 0px 10px 5px #999; }
 .btnSubmit {background-color:#fd9512;padding:8px; border-color:#FF6600; border-radius:4px; color:white; width: 200px}
 select.sel1 { font-size: 15px; width: 30px; padding: 0px 0%;cursor: pointer; border: 1px ;}
  select.sel2 { font-size: 15px; width: 60px; padding: 0px 0%;cursor: pointer; border: 1px ;background-color: white;}
  select.sel3 { font-size: 15px; width: 90px; padding: 0px 0%;cursor: pointer;border: 1px; }
  select.sel4 { font-size: 15px; width: 120px; padding: 0px 0%;cursor: pointer;border: 1px black; }
  select.sel5 { font-size: 15px; width: 150px; padding: 0px 0%;cursor: pointer;border: 1px;background-color: white; }
  select.sel6 { font-size: 15px; width: 180px; padding: 0px 0%;cursor: pointer;border: 1px; background-color: red;}

textarea{ float: left; border: 0; outline: 0; background-color: white;}
/*the container must be positioned relative:*/
.autocomplete {  position: relative; display: inline-block;}
input {  border: 1px solid transparent;  background-color: white;  padding: 2px;  font-size: 16px;}
input[type=text] {  background-color: red;  width: 100%;}
.autocomplete-items {position: absolute; border: 1px solid #d4d4d4; border-bottom: none; border-top: none; z-index: 99;
  /*position the autocomplete items to be the same width as the container:*/
  top: 27%;  left: 20;  right: 50;}
.autocomplete-items div {padding: 5px; cursor: pointer; background-color: #fff; border-bottom: 1px solid #d4d4d4;}
/*when hovering an item:*/
.autocomplete-items div:hover { background-color: #e9e9e9; }
/*when navigating through the items using the arrow keys:*/
.autocomplete-active { background-color: DodgerBlue !important;  color: #ffffff;}
.status-available{color:#2FC332;}
.status-not-available{color:#D60202;}


        

    
.icard { page-break-inside:avoid;  border-radius: 10px;  float: left;   margin:15PX;  padding:5PX;   border: 1px solid blue;  box-shadow: inset 0px 1px 0px #2ab7ec, 0px 5px 0px 0px #497a78, 0px 10px 5px #999;}
.container { border-radius: 5px;  background-color: #f2f2f2;  padding: 20px;  border-width: 0px;}
.col-25 {  float: left;  width: 35%;  margin-top: 6px;  border-width: 0px;}
.col-75 {  float: left;  width: 60%;  margin-top: 6px;  background-color: white;}
/* Clear floats after the columns */
.row:after {  content: "";  display: table;  clear: both;}
/* Responsive layout - when the screen is less than 600px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {  .col-25, .col-75, input[type=submit] {    width: 100%;    margin-top: 0;  }}

 
 



