body{font-family: 'Rubik', 'Noto Sans Malayalam', sans-serif; font-size: 14px;background: #fff;}
h1, h2, h3, h4 {  font-family: 'Poppins', 'Noto Sans Malayalam', serif;  }
a:hover{text-decoration: none;}
.logo{max-height: 60px}
nav .nav-link {color:rgba(0,0,0,0.7) !important;}
.round-more{border-radius: 20px}
.round-medium{border-radius: 12px}
.btn-primary{background: #cca542; border:none;}
.btn-primary:hover{background: #c3525a; border:none;}
.text-brown{color: #cca542; border:none;}
.bg-brown{background: #cca542;}
.text-danger{color: #c3525a !important}
.bg-danger, .btn-danger{background: #c3525a !important; border-color: #c3525a !important}
.lg-hide{display: none !important;}
.big-head{font-size: 4.5rem; line-height: 4rem}
.big-head2{font-size: 3rem; line-height: 3rem; letter-spacing: -3px}
#footer .social a{width:40px; height:40px; line-height:36px; border-radius:50%; border:1px solid #b38e30; color:#b38e30 !important; font-size:20px; text-align:center; display:inline-block; padding-top:2px}
#footer .social a:hover{background-color:#b38e30; color:#fff !important;}
hr{height: 4px; width: 40px; background: #c3525a; margin-bottom: 60px; }
.middle-border{border-color: #ddd; border-width: 0 1px; border-style: solid;}
.download-table td{vertical-align: middle; white-space: nowrap;}
.shadow-lg {
    box-shadow: 0 1rem 3rem rgba(70,20,20,.175)!important;
}


.bg-msg{background-image: url('b-msg.jpg'); background-size: cover; background-position: top center; min-height: 350px;
 font-family: 'Baloo Chettan 2', sans-serif; cursor: pointer;}
.bg-msg p {font-size: 12px; line-height: 1rem}
.dropdown-item{background-color: transparent !important;}
.bg-lightblue{background: #009ac7}

.border-bottom-thick{ border-bottom:10px solid #b38e30;}

.bg-sec1{background-image: url('bg-section1.jpg'); background-size: cover; background-position: top center;}

.bg-sec2{background-image: url('bg-section2.jpg'); background-size: cover; background-position: top center;}

.patroness{background-image: url('virgin-mary.jpg'); background-size: cover; background-position: top center; min-height: 70vh}

.jubilee-banner{background-image: url('jubilee-banner.jpg'); background-size: cover; background-position: top center; min-height: 70vh}

.banner2{background-image: url('banner2.jpg'); background-size: cover; background-position: top center; min-height: 70vh}

.message{position: absolute; left: -30px; top: -170px;}
.message span{font-size:8rem; line-height:5rem}

.carousel-indicators li{width: 10px; height: 10px;}

.head-border{border-left: 4px solid #b38e30; padding-left: 15px}

.bg-light{background:#fffbf3 !important;}

.sub-drop{background: #f8f9fa}

.sub-drop a:hover{ color: #b38e30}

.navbar-nav li a{white-space: nowrap;}

.two-tones .material-icons-two-tone {font-size:50px; filter: invert(.5) sepia(50) saturate(20) hue-rotate(200deg) brightness(50%) contrast(100%); opacity: .8}
.two-tones h5{font-size: 18px}
.two-tones a {border-right: 1px solid #bbb;}
.two-tones a:last-child {border-right: none;}

#upD .nav-item .active {background: transparent; border: none; border-bottom: 3px solid #c3525a}
#upD .nav-link{color: #c3525a; font-weight: 700}
#upD .nav-tabs {border-bottom: 1px solid #f3e8d3;}

.banner-bottom-links li{border-right: 1px solid #ccc;}
.banner-bottom-links li:last-child{border: none;}

.news-bg{position:absolute; z-index: 10; bottom:0px; left:0px; height: 100%; width: 100%; 
	background-image: linear-gradient(to bottom, rgba(255,255,255,0), #000);
	cursor: pointer;
}
.news .card{cursor: pointer;}
.news-bg:hover{background-image: linear-gradient(to bottom, rgba(255,255,255,0), #621f07);}
.news-text{position:absolute; z-index: 20; bottom:20px; left:20px; padding-right: 20px; color: #fff}

.video-style{width: 100%; height: calc(18.2vw * 1.72)}
.two-line p , .three-line p {margin-bottom:0 !important;}
.three-line {
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    max-height: 75px;
}
.six-line {
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
    /*max-height: 75px;*/
}
.four-line {
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    /*max-height: 75px;*/
}
.three-line-msg {
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    /*max-height: 75px;*/
}
.two-line {
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    max-height: 50px;
}

.one-line {
    display: block;
    padding-right: 15px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.bishop-pgm .row{border-left:4px solid #b38e30 !important; height: 100%}

.pagination .material-icons {font-size: 20px !important}
.pagination .page-link {height:38px; overflow: hidden; color: #555}
.pagination .active .page-link {background: #b38e30 !important; border: none;}
.vicar-pic-wrap{left:25%; top:-80px;  max-height: 170px; overflow: hidden;}

/*.former-vicars .row:nth-child(odd)
{
	background-image:url('timeline-row.png'); background-repeat:no-repeat; background-position:101.1% 0px; 
}
.former-vicars .row:nth-child(even)
{
	background-image:url('timeline-row.png'); background-repeat:no-repeat; background-position:-14px 0px; flex-direction: row-reverse!important; 
}

.former-vicars .row:last-child
{
	background-image:none; 
}

.former-vicars .module{padding: 7px !important;}
.former-vicars .module .priest-number{width: 50px; height: 50px;  background-color: #621f07; display: inline-block; color: #fff; line-height: 50px; font-size: 18px; position: absolute; top: 0%; left: 50%; transform: translate(-50%, -50%);}

.former-vicars .row:nth-child(odd) .module:nth-child(3){padding: 7px 15px !important;}
.former-vicars .row:nth-child(even) .module:nth-child(3){padding: 7px 15px !important;}

.former-vicars .row .module{background-image:url('timeline-h.png'); background-repeat:no-repeat; padding-top:40px; background-position:top center}*/
.former-vicars .row:nth-child(odd){background-image:url('timeline-row.png'); background-repeat:no-repeat; background-position: right center; }
.former-vicars .row:nth-child(even){background-image:url('timeline-row.png'); background-repeat:no-repeat; background-position:left center; 
flex-direction: row-reverse!important; }

.former-vicars .row:last-child
{
 background-image:none; 
}

.former-vicars .module{padding: 7px !important;}
.former-vicars .module .priest-number{width: 50px; height: 50px;  background-color: #621f07; display: inline-block; color: #fff; line-height: 50px; 
 font-size: 18px; position: absolute; top: 0%; left: 50%; transform: translate(-50%, -50%);}

.former-vicars .row:nth-child(odd) .module:nth-child(3){padding: 7px 15px !important;}
.former-vicars .row:nth-child(even) .module:nth-child(3){padding: 7px 15px !important;}

.former-vicars .row .module{background-image:url('timeline-h.png'); background-repeat:no-repeat; padding-top:40px; background-position:top center}
.come-in {
  transform: translateY(200px);
  opacity:0; 
  animation: come-in 1s ease forwards;
}
.come-in:nth-child(odd) {
  animation-duration: 0.5s;
}
.already-visible {
  transform: translateY(0);
  opacity:1;
  animation: none;
}

.priest-hover .col-sm-5 {overflow: hidden;}
.priest-hover img {transition: all .2s ease-in-out;}
.priest-hover:hover img{transform: scale(1.1);}

@keyframes come-in {
  to { transform: translateY(0);  opacity:1; }
}




.event-date{font-size: 15px; line-height: .8rem; font-weight: bold;}
.event-date h2{font-size: 28px; padding-top:2px;}
.event-date span{font-size: 13px}


.more-position{max-height: 150px; overflow: auto;}

@media (min-width: 1400px) and (max-width: 6000px)
{
.sub-drop{ width:100%; position: fixed !important; top:90px; left: 29%; max-width: 850px;}
.vicar-pic-wrap{left:25%; top:-90px; max-height: 170px; overflow: hidden;}
.bg-msg{background-image: url('b-msg.jpg'); background-size: cover; background-position: top center; min-height: 420px;
 font-family: 'Baloo Chettan 2', sans-serif; cursor: pointer;}
 .bg-msg p {font-size: 16px; line-height: 1.3rem}
}
@media (min-width: 1200px) and (max-width: 1399px){
.sub-drop{ width:100%; position: fixed !important; top:90px; left: 29%; max-width: 700px; max-height:76vh; overflow: auto;}
.navbar-nav li a{white-space: nowrap; font-size: 14px; text-overflow: ellipsis;overflow: hidden; padding-right: 0}
.vicar-pic-wrap{left:25%; top:-60px; }
.bg-msg{background-image: url('b-msg.jpg'); background-size: cover; background-position: top center; min-height: 350px;
 font-family: 'Nato Sans Malayalam', sans-serif; cursor: pointer;}
.bg-msg p {font-size: 12px; line-height: 1rem}
.patroness{background-image: url('virgin-mary.jpg'); background-size: cover; background-position: top center; min-height: 73vh}
.jubilee-banner{background-image: url('jubilee-banner.jpg'); background-size: cover; background-position: top center; min-height: 73vh}
.banner2{background-image: url('banner2.jpg'); background-size: cover; background-position: top center; min-height: 73vh}
::-webkit-scrollbar { width: 5px; border-radius: 4px}
::-webkit-scrollbar-track {background: #f1f1f1;}
::-webkit-scrollbar-thumb {background: #ccc;}
::-webkit-scrollbar-thumb:hover {background: #555;}
}
/*@media (min-width: 1200px) and (max-width: 1399px)
{

.sub-drop{ width:100%; position: fixed !important; top:90px; left: 29%; max-width: 780px;}
.vicar-pic-wrap{left:25%; top:-60px; }
.bg-msg{background-image: url('b-msg.jpg'); background-size: cover; background-position: top center; min-height: 350px;
 font-family: 'Baloo Chettan 2', sans-serif; cursor: pointer;}
.bg-msg p {font-size: 12px; line-height: 1rem}

}*/

button:focus,
button:active{
    box-shadow:none !important;
    outline:0px !important;
}


.overlay .two-line{overflow:visible !important;}


@media (min-width: 720px) and (max-width: 1000px)
{
 .sm-hide{display: none !important;}
 .lg-hide{display: inline-block !important;}
 .md-hide{display: none !important;}
 .md-show{display: inline-block !important;}

 .bg-msg{background-image: url('../img/b-msg.jpg'); background-size: cover; background-position: top center; min-height: 380px !important; cursor: pointer;}
 .bg-msg p {font-size: 12px; line-height: 1rem}
  #banner .overlay
  {
   background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,1)); height: 100%; text-align: center; 
   padding: 120px !important; padding-bottom: 160px !important
  }
  .head-sm{margin-top: 50% !important;}
 .patroness, .banner2{background-position: 85%; min-height: 50vh}
 .jubilee-banner{background-position: 95%; min-height: 50vh}
 .big-head{font-size: 4rem; line-height: 2rem}

 .sub-drop{background: #fff; border: none;}
  .priest-pic-wrap{height: 310px; overflow: hidden;}
 .priest-list .priest-pic-wrap{height: 230px !important; overflow: hidden;}
 #banner .overlay{background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,1));height: 100%;min-height: 60vh;}

}
.priest-pic-wrap{height: 230px; overflow: hidden;}
@media (min-width: 320px) and (max-width: 700px)
{
	.logo{max-height: 45px}
	.sm-hide{display: none !important;}
	.lg-hide{display: inline-block !important;}
	.collapse{padding-top: 30px; padding-bottom: 30px; height: 90vh; overflow: auto;}
	#obituary h5{font-size: 15px}
	.big-head{font-size: 2.5rem; line-height: 2rem}
	.message{position: static; left: 0px; top: 0px;}
	.message span{font-size: 6rem; height: 60px !important; display: block; overflow: hidden !important; text-align: center; float:none !important;}
.patroness, .jubilee-banner, .banner2{background-position: 85%; min-height: 60vh}
	 #banner .container{min-height: 60vh;  text-align: center;}
        #banner .overlay { 
    background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,1)); 
    height: 100%; 
    min-height: 60vh; 
}
          .head-sm{margin-top: 60% !important;}
            .overlay .two-line{overflow:hidden !important;}
/*#banner .col-sm-6{background-color: rgba(0,0,0,.5); min-height: 80vh}*/
	.slide-sub{overflow: auto; width: 100%}
	.slide-sub .card-deck{width: 1100px;}
	.slide-sub .card{width: 14.25%; float: left;}
	.middle-border{border-color: #ddd; border-width: 1px 0px; border-style: solid;}
	.sub-drop{background: #fff; border: none;}
	.sub-drop h5{display: none;}
        .sub-head {display: block !important; font-size: 16px; font-weight: bold;}
	#upD .nav-link{padding-left: 8px; padding-right: 8px}
	.two-tones a {border-right: none; margin-bottom: 20px}
	nav .nav-link{font-size: 18px; margin-bottom:2px; padding-bottom: 10px; border-bottom:1px solid #eee;}
	.banner-bottom-links{min-width: 830px; justify-content: left!important;}
	.banner-bottom-links li{float: left; white-space: nowrap;}
	.title {font-size: 17px}
	.video-style{width: 100%; height: calc(31.4vw * 1.72)}
	.vicar-pic-wrap{left:21%; top:-80px; max-height: 150px; overflow: hidden;}
/*	.former-vicars .row:nth-child(odd), .former-vicars .row:nth-child(even){background-image:none; margin: 0; }
	.former-vicars .row .module{background-image:url('timeline.png'); background-repeat:no-repeat; padding-top:40px;
	 background-position:center center;}
	.former-vicars hr {margin-bottom: 2px; width: 100%}*/

.former-vicars .row:nth-child(odd), .former-vicars .row:nth-child(even){background-image:none; margin: 0; }
 .former-vicars .row .module{background-image:url('timeline.png'); background-repeat:no-repeat; padding-top:40px;
  background-position:center center; }
 .former-vicars hr {margin-bottom: 60px; width: 100%}
	.priest-pic-wrap{height: 330px; overflow: hidden;}
        .birthdays .priest-pic-wrap{height: 230px; overflow: hidden;}
        .bg-msg{background-image: url('b-msg.jpg'); background-size: cover; background-position: top center; min-height: 350px;
     font-family: 'Baloo Chettan 2', sans-serif; cursor: pointer;}
     .bg-msg p {font-size: 12px; line-height: 1rem}
     .msg-date{font-size: 14px} .msg-date h4{font-size: 20px}
	
}
.parish-map iframe{width: 100% !important}

@media (min-width: 1024px) and (max-width: 1399px)
{
.sub-drop{ width:100%; position: fixed !important; top:90px; left: 29%; max-width: 780px;}
}


.loading {
      text-align: center;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
    }

    .loading__text {
      font-weight: 500;
      font-size: 18px;
      color: #777
    }

    .loading__bar {
      position: relative;
      height: 4px;
      width: 320px;
      background-color: rgb(160, 160, 160);
      border-radius: 2em;
      overflow: hidden;
    }

    .loading__bar::after {
      position: absolute;
      top: 0;
      left: 0;
      content: "";
      width: 50%;
      height: 100%;
      background: linear-gradient(90deg, #fff5, rgba(240, 240, 240, 0.891));
      animation: loading-animation 1.3s infinite;
      border-radius: 1em;
    }

    @keyframes loading-animation {
      0% {
        left: -50%;
      }

      100% {
        left: 150%;
      }
    }