@charset "utf-8";
 @import url("https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,500,600,700,800,900"); body {
margin: 0 !important;
padding: 0 !important;
font-family: 'Montserrat', sans-serif !important;
font-size: 14px !important;
font-weight: 400 !important;
font-style: normal !important;
color: #2f2f33 !important;
}
h1 { 
margin: 0 0 10px 0 !important;
padding: 0 !important;
font-family: 'Montserrat', sans-serif !important;
font-size: 30px !important;
font-weight: 700 !important;
font-style: normal !important;
color: #d82727 !important;
text-transform: uppercase !important;
display: block !important;
text-align: center !important;
}
h2 { 
margin: 0 0 10px 0 !important;
padding: 0 !important;
font-family: 'Montserrat', sans-serif !important;
font-size: 21px !important;
font-weight: 700 !important;
font-style: normal !important;
color: #d82727 !important;
text-transform: capitalize !important;
display: block !important;
}
h3 { 
margin: 0 0 15px 0 !important;
padding: 0 !important;
font-family: 'Montserrat', sans-serif !important;
font-size: 18px !important;
font-weight: 600 !important;
font-style: normal !important;
color: #d82727 !important;
line-height: 24px !important;
text-transform: capitalize !important;
display: block !important;
}
p { 
margin: 0 0 20px 0 !important;
padding: 0 !important;
font-family: 'Montserrat', sans-serif !important;
font-size: 16px !important;
font-weight: 600 !important;
font-style: normal !important;
color: #3a3a3a !important;
line-height: 30px !important;
display: block !important;
text-align: justify !important;
}
.parents-list .su-list ul li {
line-height: 30px !important;
}
.parents-list .su-list ul li i {
line-height: 30px !important;
}
.parents-list .su-list ul li p {
margin: 0 0 10px 0 !important;
}
article, aside, figcaption, figure, footer, header, hgroup, main, nav, section { 
float: left;
width: 100%;
} header { 
min-height: 130px;
background: #d82727;
}
.brand-logo { 
float: left;
width: 100%;
min-height: 130px;
position: relative;
}
.brand-logo img {
max-height: 100%;
max-width: 100%;
width: auto;
height: auto;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
}
#access {
margin-top: 38px;
display: block;
float: left;
width: 100%;
min-height: 36px; border-radius: 5px;
}
#access ul {
margin: 0;
padding: 0;
font-family: 'Montserrat', sans-serif !important;
font-size: 14px !important;
font-weight: 600 !important;
text-transform: uppercase !important;
list-style: none;
}
#access li {
float: left;
position: relative;
padding: 0;
margin: 0;
}
#access a {
color: #fff !important;
display: block;
float: left;
padding: 0 20px;
text-decoration: none;
line-height: 36px;
}
#access ul ul {
display: block;
float: left;
margin: 0;
position: absolute;
left: 0;
top: 150%;
width: 260px;
z-index: 999;
visibility: hidden;
opacity: 0;
-webkit-transition: all 0.4s;
-moz-transition: all 0.4s;
-o-transition: all 0.4s;
-ms-transition: all 0.4s;
transition: all 0.4s;
}
#access ul ul ul {
left: 100%;
top: 0;
}
#access ul ul a {
background: #0c3b5e;
color: #FFF !important;
font-size: 14px !important;
font-weight: 400 !important;
height: auto;
line-height: 21px;
padding: 12px 18px !important;
width: 260px;
border-bottom: 1px solid #555;
margin: 0 !important;
}
#access li:hover > a, #access ul ul :hover > a, #access a:focus {
color: #0c3b5e !important;
}
#access li:hover > a, #access a:focus {
color: #0c3b5e !important;
}
#access ul li:hover > ul {
top: 100%;
visibility: visible;
opacity: 1;
}
#access ul .current-menu-item > a {
color: #fff !important;
}
#mob-menu {
display: none;
}
#mob-menu-container {
display: none;
float: right;
position: relative;
}
button.butn.btn {
float: right;
margin-top: 40px;
color: #FFF;
background: #d82727;
border: 1px solid #FFF;
outline: none;
} #home-banner { 
display: block;
}
#marquee-text{
background:#d02727;
padding-top: 10px;
}
#marquee-text h3{
color:#fff !important;
}
#marquee-text h3 a{
color:#fff !important;
}
#home-banner  img { 
display: block;
width: 100%;
}
#side-bar { 
position: absolute;
right: 0;
top: 130px;
width: 80px;
display: block;
font-size: 8px !important;
text-align: center !important;
text-transform: uppercase !important;
z-index: 999;
}
#side-bar a { 
color: #FFF !important;
text-decoration: none !important;
padding-top: 40px !important;
}
#side-bar .link01 { 
float: left;
width: 100%;
min-height: 80px;
background: #f58989;
}
#side-bar .link02 { 
float: left;
width: 100%;
min-height: 80px;
background: #0c3b5e;
}
#side-bar .link03 { 
float: left;
width: 100%;
min-height: 80px;
background: #a4a4a4;
}
#side-bar .link04 { 
float: left;
width: 100%;
min-height: 80px;
background: #ec4d4d;
}
#side-bar .link05 { 
float: left;
width: 100%;
min-height: 80px;
background: #d82727;
} #content-area {
padding: 50px 0;
}
#WelcomeRow { 
padding: 50px 0;
}
#WelcomeRow .img-holder { 
float: left;
width: 100%;
}
#WelcomeRow .img-holder img { 
display: block;
width: 100%;
}
#CountRow { 
padding: 0 0 50px 0;
}
#CountRow .count-box { 
float: left;
width: 100%;
text-align: center;
}
#CountRow .count-box .count-icon { 
float: left;
width: 100%;
min-height: 60px;
position: relative;
}
#CountRow .count-box .count-icon img {
max-height: 100%;
max-width: 100%;
width: auto;
height: auto;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
}
#CountRow .count-box .count-value { 
float: left;
width: 100%;
font-size: 48px !important;
font-weight: 700 !important;
color: #d82727 !important;
margin-bottom: 10px;
}
#CountRow .count-box .count-text { 
float: left;
width: 100%;
font-size: 14px !important;
font-weight: 400 !important;
color: #0c3b5e !important;
line-height: 24px !important;
}
#MessageRow { 
padding: 50px 0;
background: #ec4d4d;
}
#MessageRow .message-box { 
display: block;
background: #FFF;
padding-bottom: 20px;
}
#MessageRow .message-box .message-title { 
float: left;
width: 100%;
font-size: 18px !important;
font-weight: 700 !important;
color: #0c3b5e !important;
text-align: center !important;
border-bottom: 1px solid #ec4d4d !important;
padding: 15px 0;
margin-bottom: 20px;
}
#MessageRow .message-box p { 
padding: 0 18% !important;
text-align: center !important;
margin: 0 !important;
}
#PatronRow { 
padding: 50px 0;
}
#PatronRow .img-holder { 
float: left;
width: 100%;
min-height: 385px;
background: #000;
}
#EventsRow { 
padding: 0 0 50px 0;
}
#EventsRow  .view-all { 
position: absolute;
right: 15px;
top: 10px;
font-family: 'Montserrat', sans-serif !important;
font-size: 14px !important;
font-weight: 600 !important;
letter-spacing: -1px !important;
color: #a8a8a9 !important;
text-decoration: none !important;
}
#EventsRow h1 { 
margin-bottom: 30px !important;
text-align: center !important;
}
#EventsRow .events-box { 
float: left;
width: 100%; padding-bottom: 30px;
border: 1px solid #cdcdcd;
transition: transform .5s;
-moz-transition: transform .5s;
-webkit-transition: transform .5s;
-o-transition: transform .5s;
-ms-transition: transform .5s;
}
#EventsRow .events-box:hover { 
transform: translateY(-10px);
-moz-transform: translateY(-10px);
-webkit-transform: translateY(-10px);
-o-transform: translateY(-10px);
-ms-transform: translateY(-10px);
}
#EventsRow .events-box h3 { 
text-align: center !important;
}
#EventsRow .events-box .img-holder { 
float: left;
width: 100%;
margin-bottom: 30px;
}
#EventsRow .events-box .img-holder  img { 
width: 100%;
display: block;
}
#EventsRow .events-box .date-location { 
float: left;
width: 100%;
text-align: center !important;
color: #727272 !important;
margin-bottom: 30px;
}
#EventsRow .register-btn { 
width: 60%;
margin: 0 auto;
display: block;
background: #d82727;
text-align: center !important;
font-size: 18px !important;
font-weight: 600 !important;
text-transform: uppercase !important;
line-height: 40px !important;
color: #FFF !important;
text-decoration: none !important;
border-radius: 8px !important;
}
#CalendarRow { 
padding: 0 0 50px 0;
}
#CalendarRow  .view-all { 
position: absolute;
right: 15px;
top: 10px;
font-family: 'Montserrat', sans-serif !important;
font-size: 14px !important;
font-weight: 600 !important;
letter-spacing: -1px !important;
color: #a8a8a9 !important;
text-decoration: none !important;
}
#CalendarRow h1 { 
margin-bottom: 30px !important;
text-align: center !important;
}
#CalendarRow .calendar-box { 
float: left;
width: 100%;
}
#CalendarRow .calendar-box .date { 
float: left;
width: 100%;
text-align: center !important;
font-size: 48px !important;
font-weight: 700 !important;
color: #d82727 !important;
line-height: 36px !important;
}
#CalendarRow .calendar-box .date span { 
float: left;
width: 100%;
font-size: 16px !important;
font-weight: 400 !important;
color: #0c3b5e !important;
}
#CalendarRow .calendar-box .time { 
float: left;
width: 100%;
background: url(//www.josephs.ac.in/wp-content/themes/st-joseph-theme/images/time.png) 0 2px no-repeat;
padding-left: 20px;
text-transform: capitalize !important;
color: #727272 !important;
}
.more-btn { 
float: left;
width: auto;
border: 1px solid #a8a8a9;
padding: 0 30px;
line-height: 40px;
font-family: 'Montserrat', sans-serif !important;
font-size: 14px !important;
font-weight: 600 !important;
letter-spacing: -1px !important;
color: #a8a8a9 !important;
text-decoration: none !important;
} footer { 
padding: 50px 0;
background: #d82727;
}
footer h1 { 
color: #FFF !important;
text-align: center !important;
}
footer p { 
color: #FFF !important;
margin: 0 !important;
border-right: 2px solid #FFF;
}
footer .footer-logo { 
display: block;
text-align: center;
margin: 30px 0;
}
footer .social-media { 
display: block;
text-align: center;
margin-bottom: 30px;
} .bx-controls.bx-has-controls-direction { 
width: 82px;
margin: 30px auto 0 auto;
display: block;
position: relative;
right: auto;
top: auto;
}
.bx-prev {
float: left;
width: 36px;
height: 36px;
margin-right: 10px;
display: block;
border-radius: 50%;
background: url(//www.josephs.ac.in/wp-content/themes/st-joseph-theme/images/left-arrow.png) 50% 50% no-repeat #212121;
text-indent: -9999px;
}
.bx-next {
float: left;
width: 36px;
height: 36px;
display: block;
border-radius: 50%;
background: url(//www.josephs.ac.in/wp-content/themes/st-joseph-theme/images/right-arrow.png) 50% 50% no-repeat #212121;
text-indent: -9999px;
}
.table-bordered td, .table-bordered th {
text-align: center;
}
section#WelcomeRow h2 {
text-align: center;
}
section#WelcomeRow p {
text-align: center !important;
}
section#PatronRow p {
text-align: center !important;
}
footer p a {
color: #fff;
font-weight: 800;
}
footer p a:hover {
color: #fff;
} 
header .row {
align-items: center;
}