@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;900&display=swap');
body{margin:auto; background-color:#ebebeb; font-size:1.3em; font-family: 'Roboto', sans-serif;}
.sliderArea{padding:0px !important; margin:0px !important; margin-top: -20px !important;}
.navbar-brand {
    position: relative;
    background:url('../images/LCIT-LEGAL-STUDIES-LOGO.webp');
    width: 250px;
    left: 15px;
    background-size: contain;
	background-repeat:no-repeat; 
	background-position:center;
}
.courseBox{ min-height:250px; background-color:#FFF; margin-top:20px; padding:5px; border:#999999 1px solid;}
.courseBox h2{ font-size:1.7em; text-align:center;}
.courseBox p a{ padding:5px; color:#FFF; background:#000066; border-radius:6px; transition: background .5s;}
.courseBox p a:hover{ padding:5px; color:#FFF; background:#FF3300; border-radius:6px;}
.containerBox{ min-height:300px; background-color:#FFFFFF; border-radius:10px; padding:10px; text-align:justify; margin-top:20px;}
.containerBox p{ font-size:1.4em; line-height:30px; text-align:justify;}
.containerBox ol li{ font-size:1.4em; line-height:30px; text-align:justify;}
.containerBox ul li{ font-size:1.4em; line-height:30px; text-align:justify;}
.containerBox1{ min-height:300px; padding:10px; text-align:justify; margin-top:20px;}
.containerBox1 p{ font-size:1.5em; line-height:30px;}
.footerContainer{ min-height:150px; background-color:#000033; margin-top:20px;}
.header{ font-size:2em; font-weight:900;}
.subheader{ font-size:1.8em; font-weight:900; color:#666666;}

.miniBanner{ min-height:250px; background-image:url(../images/banner1.webp); background-position:center; background-repeat:no-repeat; background-size:cover; padding-top:70px;}
.breadcrumb{ background:transparent !important;}
.jumbotron{ background-color:transparent !important; margin:0px !important; padding:0px !important; color:#fff; font-size:2.5em !important; padding-left:15px !important;}

.profileBox{ min-height:370px; background:#FFF; margin:5px; border:#888 1px solid; padding:2%; border-radius:5px; text-align:center;}
.itemtop1{ min-height:320px;}
.itembot1{ min-height:50px; padding-top:5px;}
.itemtop1 h2{font-size:1.7em;}
.itemtop1 p{margin-top:20px; font-size:.9em;}

.footBox{ min-height:200px; margin-top:20px; margin-bottom:20px; padding:10px;}
.footBox h3{ text-align:center; color:#FFF; font-size:1.5em; font-weight:900;}
.footBox p{ color:#FFF; font-size:1.2em;}
.crewBox{ min-height:40px; margin-bottom:20px; text-align:center; padding-top:15px;}
.crewBox p{ color:#FFF;}
.red{ color:#FF0000;}
.green{ color:#339933;}

.social ul{ margin-top:50px; text-align:center;}
.social ul li{ text-align:center; margin-left:10px; margin-right:10px; color:#FFF; display:inline;}
.social ul li a{ font-size:1.2em; text-decoration:none; color:#FFF;}
.social ul li a:hover{ font-size:1.2em; text-decoration:none; color:#FFFF00; transition: color .15s;}

.quick ul{ margin-top:50px;}
.quick ul li{ margin-left:10px; margin-right:10px; color:#FFF; display:inline;}
.quick ul li a{ font-size:1.2em; text-decoration:none; color:#FFF;}
.quick ul li a:hover{ font-size:1.2em; text-decoration:none; color:#FFFF00; transition: color .15s;}

.dropdown-submenu {
    position: relative;
    > a::after {
      display: block;
      content: "";
      float: right;
      width: 0;
      height: 0;
      border-color: transparent;
      border-style: solid;
      border-width: 4px 0 4px 4px;
      border-left-color: #000;
      margin-top: 6px;
      margin-right: -10px;
    }
    > ul.dropdown-menu {
      position: absolute;
      left: 100%;
      top: 0;
      margin-left: 5px;
    }
  }
  
/* Style the list */
ul.breadcrumb {
  
  list-style: none;
  background-color: #eee;
}

/* Display list items side by side */
ul.breadcrumb li {
  display: inline;
  font-size: 18px;
  color:#FFF;
}

/* Add a slash symbol (/) before/behind each list item */
ul.breadcrumb li+li:before {
  padding: 8px;
  color: #FFF;
  content: "/\00a0";
}

/* Add a color to all links inside the list */
ul.breadcrumb li a {
  color: #FFF;
  text-decoration: none;
}

/* Add a color on mouse-over */
ul.breadcrumb li a:hover {
  color: #FFF;
  text-decoration: underline;
}


/* OWL */
#owl-demo .item { min-height:350px; background:#FFF; margin:5px; border:#888 1px solid; padding:2%; border-radius:5px; text-align:center;}
#owl-demo .item p{ margin-top:20px; font-family: 'Roboto', sans-serif; font:1em; color:#010101;}
#owl-demo .item h2{ font-size:1.7em;}
.probox{ height:150px; width:150px; border-radius:150px; margin-left:auto; margin-right:auto; background-position:center; background-repeat:no-repeat; background-size:contain;}

#owl-demo1 .item { min-height:350px; background:#FFF; margin:5px; border:#888 1px solid; padding:2%; border-radius:5px;}
#owl-demo1 .item h2{ font-size:1.7em;}
#owl-demo1 .item p{ font-size:1.2em;}
#owl-demo1 .item p{ margin-top:20px; font-family: 'Roboto', sans-serif; font:1em; color:#010101;}

.probox1{ height:150px; width:150px; border-radius:150px; margin-left:auto; margin-right:auto; background-position:center; background-repeat:no-repeat; background-size:cover;}

.itemtop{ min-height:300px;}
.itembot{ min-height:50px; padding-top:5px;}
.proBtn{ background:#000066; border:none; color:#FFF; padding:10px; border-radius:10px;}

.formArea{ min-height:40px; padding:10px; background:#EBEBEB; border:none; border-radius:10px; margin-bottom:10px;}
.formArea1{ min-height:300px; padding:10px; background:#EBEBEB; border:none; border-radius:10px; margin-bottom:10px;}
.txtbox{ width:100%; height:35px; border:none; outline:none; padding-right:1%; padding-right:1%; font-family: 'Roboto', sans-serif; margin-bottom:10px;}
.txtboxA{width:100%; height:100px; border:none; outline:none; padding-right:1%; padding-right:1%; font-family: 'Roboto', sans-serif; margin-bottom:10px;}
.newsBox{ min-height:300px; margin-bottom:10px; border:#999999 1px solid;}
.newsUpper{ height:200px; background-position:center; background-repeat:no-repeat; background-size:cover;}
.newsLower{ min-height:100px; padding:5px;}
.newsLower h3{font-size:1.2em; text-align:center; font-weight:900; margin:0px; padding:0px;}
.newsLower p{font-size:1.1em; line-height:20px; text-align:center; margin-top:15px; text-decoration:none; color:
#000066;}
.newsLower p a:hover{text-decoration:none;}


.container.gallery-container {
    background-color: #fff;
    color: #35373a;
    min-height: 100vh;
    padding: 30px 50px;
}

.gallery-container h1 {
    text-align: center;
    margin-top: 50px;
    font-family: 'Droid Sans', sans-serif;
    font-weight: bold;
}

.gallery-container p.page-description {
    text-align: center;
    margin: 25px auto;
    font-size: 18px;
    color: #999;
}

.tz-gallery {
    padding: 40px;
}

/* Override bootstrap column paddings */
.tz-gallery .row > div {
    padding: 2px;
}

.tz-gallery .lightbox img {
    width: 100%;
    border-radius: 0;
    position: relative;
}

.tz-gallery .lightbox:before {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -13px;
    margin-left: -13px;
    opacity: 0;
    color: #fff;
    font-size: 26px;
    font-family: 'Glyphicons Halflings';
    content: '\e003';
    pointer-events: none;
    z-index: 9000;
    transition: 0.4s;
}


.tz-gallery .lightbox:after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    background-color: rgba(46, 132, 206, 0.7);
    content: '';
    transition: 0.4s;
}

.tz-gallery .lightbox:hover:after,
.tz-gallery .lightbox:hover:before {
    opacity: 1;
}

.baguetteBox-button {
    background-color: transparent !important;
}

@media(max-width: 768px) {
    body {
        padding: 0;
    }
}