.navbar
{
 
  
  position:relative;
  font-family:'Noto Sans TC', sans-serif;
  /* //background:  #2196f3; */
  background-image: linear-gradient(to right,#28166f,#007cc3); /* Standard
  line-height: 25px;
  min-height: 60px;
  margin-bottom: 20px;
  border-radius:0px;
  width:100%;

  
}

#navbarDropdown{
   color:white;
    font-size: 15px;
    line-height: 25px;
    float:right;
    font-family:'Noto Sans TC', sans-serif;
}
 


  .dropdown-item {
    color:#2196f3 !important;
    display: block !important;
    padding: .25rem 1.5rem;
    clear: both;
    font-weight: 300;
    font-family:'Arial',sans-serif;
    text-align: inherit;
    white-space: nowrap;
    background-color: transparent;
    border: 0;

  }
 
  
   
a.logo {
    font-size: 25px;
    font-weight: 550;
  color:#e5eeee !important;
  /* color: black; */
  text-align: center;
  padding: 12px;
  text-decoration: none;
  font-size: 25px; 
  line-height: 25px;
  border-radius: 4px;
}
 a:hover {
  color: white;
}
a.logo1 {
  font-size: 25px;
  font-weight:550;
color:#2196f3 !important;
/* color: black; */
text-align: center;
padding: 12px;
text-decoration: none;
font-size: 25px; 
line-height: 25px;
border-radius: 4px;
color:"#1890ff"!important;
margin-Left:"30px"!important;
}
a.logo2
{
  font-size: 25px;
    font-weight: 550;
    color: #e5eeee !important;
    text-align: center;
    padding: 12px;
    text-decoration: none;
    font-size: 25px;
    line-height: 25px;
    border-radius: 4px;
}
/* dropdown menu on hover background color*/

a.dropdown-item:hover{
  background:#144c9b;
  color: #ffffff !important;
} 

.dropdown-item:hover{
  color:white;
  font-weight:500;
 
}
  


nav.navbar.navbar-expand-lg.navbar-light{
      border-radius: 1px;
      height:80px;
      font-family: 'Noto Sans TC', sans-serif;
      width: 100%;
      position: fixed; 
      top: 0;
      z-index: 4;
      
}
navbar-nav {
  float: right;
}
 




.navbar {
  border-radius: 0px !important;
  font-family:'Noto Sans TC', sans-serif;
  /* background:  #2196f3; */
  min-height: 80px !important;
 
}
ul.navbar-nav.navbar-right
{
  margin-right: 10px;
}
.navbar-dark .navbar-nav 
{
  color:#ffffff !important;
 font-size: 15px;
font-family:'Noto Sans TC', sans-serif;

}
.nav-link
{
  color:#ffffff !important;
 font-size: 15px;
font-family:'Noto Sans TC', sans-serif;
  padding-top: 3px;
  padding-bottom: 3px;
}
.navbar-dark .navbar-nav .nav-link:hover
{
   color: #fff !important;
}



.navbar-nav>li>.dropdown-menu {
  border-radius: 3px !important;
  background-color: white !important;
  
} 


/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 426px) and (max-width: 768px)
{
  .navbar-dark .navbar-nav .nav-link
  {
    /* width:200% !important; */
    font-size:12px !important;
  }
  #navbarSupportedContent{
    margin-left: -12px !important;
    margin-right: -9px !important;
  }
  #navbar_navpage_logo_css ,
  #navbar_admin_navpage_logo_css{
    width:150px !important;
  }
  /* snehal-task3612-Akshay sir---1)On-boarding Agreement, 2)Agency side-menu/sub menu changes */
.widthissue_camp_submenu{
    margin-left: -18px !important;
}
} 
 /* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
  .displayerror
  {
  padding-top: 160px !important;
  display:block !important;
   } 
 .createbutton
 {
   padding-left:50px  !important;
 }
 .displayerrorsupp
  {
  padding-top: 140px !important;
  display:block !important;
   } 
 
  .backbutton
  {
   padding-left:170px  !important;

  }
  .labelfont
  {
    font-size: 13px !important;
  }

} 

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
 

.displayerror
  {
  /* padding-top: 150px !important; */
  display:block !important;
   } 
 .createbutton
 {
   padding-left:160px  !important;
 }
 .displayerrorsupp
  {
  padding-top: 140px !important;
  display:block !important;
   } 
 
  .backbutton
  {
   padding-left:170px  !important;

  }

} 
 
/* Medium devices (landscape tablets, 768px and up) */ 
@media only screen and (min-width: 768px) {
  .displayerror
  {
  padding-top: 150px !important;
  display:block !important;
   } 
 .createbutton
 {
   padding-left:160px  !important;
 }
 .displayerrorsupp
  {
  padding-top: 140px !important;
  display:block !important;
   } 
 
  .backbutton
  {
   padding-left:170px  !important;

  }

} 

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
  .displayerror
  {
  padding-top: 120px !important;
  display:block !important;
   } 
 .createbutton
 {
   padding-left:160px  !important;
 }
 .displayerrorsupp
  {
  padding-top: 140px !important;
  display:block !important;
   } 
 
  .backbutton
  {
   padding-left:170px  !important;

  }

} 


/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
  .displayerror
  {
  padding-top: 120px !important;
  display:block !important;
   } 
 .createbutton
 {
   padding-left:265px  !important;
 }
 .displayerrorsupp
  {
  padding-top: 140px !important;
  display:block !important;
   } 
 
  .backbutton
  {
   padding-left:170px  !important;

  }

} 




/* table */
.table-bordered>tbody>tr>td, .table-bordered>tbody>tr>th, .table-bordered>tfoot>tr>td, .table-bordered>tfoot>tr>th {
  background-color: white !important;
}

/* progress bar */
.progress-bar {
  float: left;
  width: 0;
  height: 100%;
  font-size: 12px;
  line-height: 20px;
  color:white !important;
  text-align: center;
  background-color: #337ab7;
  -webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
  -webkit-transition: width .6s ease;
  -o-transition: width .6s ease;
  transition: width .6s ease;
}

.dropbtn {
  /* background-color: green; */
  color: white;
  padding: 16px;
  font-size: 16px;
  border: none;
}

.dropdown {
  position: relative;
  display: inline-block;
}

.dropdown-content {
  display: none;
  color: #144c9b;
  position: absolute;
  background-color: #fff;
  min-width: 160px;
  
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
 
}
.dropdown-content a:hover {background-image: linear-gradient(to right,#144c9b,#007cc3)!important; color: #fff !important;}
.dropdown:hover .dropbtn {
  /* background-color: #2196f3!important;color:yellow!important; */
  /* border-top: 3px solid white; */
   /* font-size:large!important; */
  }

.dropdown:hover .dropdown-content {display: block;}

.navbar-nav>li>a {
  padding-top: 3px;
  padding-bottom: 3px;
}




/* new */

 
.dropdown-menu > li.kopie > a {
  padding-left:5px;
}






.dropdown-menu > li > a:hover {

background-color: green;
}  

@media only screen and (max-width: 768px){

.navbar-nav  {
   display: inline;
}
.navbar-default .navbar-brand {
  display: inline;
}
.navbar-default .navbar-toggle .icon-bar {
  background-color: #fff;

}
.navbar-default .navbar-nav .dropdown-menu > li > a {
  color: red;
  background-color: blue;
  border-radius: 4px;
  margin-top: 2px;   
}
 .navbar-default .navbar-nav .open .dropdown-menu > li > a {
   color:blue;
 }
 .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
 .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
   background-color:blue !important;
 }

 .navbar-nav .open .dropdown-menu {
   border-bottom: 1px solid white; 
   border-radius: 0;
 }
.dropdown-menu {
    padding-left: 10px;
}
.dropdown-menu .dropdown-menu {
    padding-left: 20px;
 }
 .dropdown-menu .dropdown-menu .dropdown-menu {
    padding-left: 30px;
 }
 li.dropdown.open {
  border: 0px solid red;
 }

}

.dropdown-menu>li>a {
  display: block;
  padding: 3px 20px;
  clear: both;
  font-weight: 400;
  line-height: 1.42857143;
 
  white-space: nowrap;
  /* background-color: blue; */
}

@media (min-width: 768px) {
ul.nav li:hover > ul.dropdown-menu {
  display: block;
  float:right;
}
#navbar {
  text-align: center;
}
}  



/* @media (min-width: 768px){
.navbar-right .dropdown-menu {
  right:30% !important;
  left:20% !important;
}
} */


/* ul.dropdown-menu{
  float:right !important;
} */


/* on hover sub menu */
.submenu>li>a {
  position: relative;
  display: block;
  padding: 5px 5px 3px!important;
  color: black!important;
}



/* sub menu align right */
ul.dropdown-menu.nav{
  top:5% !important;
  /* right:60%; */
  left:100%!important;
}

/* .navbar-dark .navbar-nav .nav-link:hover  {
  color:yellow !important;
   font-size:large!important;
} */

 


.shadow {
 -moz-box-shadow:    3px 3px 5px 6px #ccc;
  -webkit-box-shadow: 3px 3px 5px 6px #ccc;
  box-shadow:         3px 3px 5px 6px #ccc; 
}
  /* /* box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); */


  /* .nav-item:hover::after{width:100%;}
  .navbar-dark .navbar-nav .active > .nav-link, .dropdown-item 
  .navbar-dark .navbar-nav .nav-link.active, 
  .navbar-dark .navbar-nav .nav-link.show, 
  .navbar-dark .navbar-nav .show > .nav-link,.navbar-dark .navbar-nav .nav-link:focus,
   .navbar-dark .navbar-nav .nav-link:hover{color:white;}
  .nav-link{padding:15px 5px;transition:0.2s;}
 .dropdown-item.active, .dropdown-item:active{color:#212529;} 
  .dropdown-item:focus, .dropdown-item:hover{background:white;}  */


  .nav-item::after{content:'';display:block;width:0px;height:2px;background:white;transition: 0.2s;}
.nav-item:hover::after{width:100%;}
.navbar-dark .navbar-nav .active > .nav-link,.dropdown-item , .navbar-dark .navbar-nav .nav-link.active,
 .navbar-dark .navbar-nav .nav-link.show, .navbar-dark .navbar-nav .show > .nav-link,
 .navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover{color:white;}
.nav-link{padding:15px 5px;transition:0.2s;}
.dropdown-item.active, .dropdown-item:active{color:#212529;}
.dropdown-item:focus, .dropdown-item:hover{background:white;}

/* snehal-task3612-Akshay sir---1)On-boarding Agreement, 2)Agency side-menu/sub menu changes */
@media only screen and (max-width: 425px)
{
  .widthissue_camp{
    margin-left: 15px !important;
  }
    
}
/* medium devices (Tablet 425 and down) */ 
@media only screen and  (min-width: 320px) and (max-width: 425px)
{
    
  
}
  @media only screen and (min-width: 426px) and (max-width: 768px)
{
    
    
}
@media only screen and (min-width: 769px) and (max-width: 1024px)
{
   
}
@media only screen and (min-width: 1025px)
{
    
   

}