body {
    font-family:  'Mada', sans-serif;
    font-size: 14px;
    line-height: 1.42857143;
    color: #333;
    background-color: #fff;
    overflow-x: hidden;
}

.thumbnail_container {
     position: relative;
     width: 100%;
     padding-bottom: 100%; <!-- matching this to above makes it square -->
     float:left;
}

.thumbnail {
    position:absolute;
    width:100%;
    height:100%;
}
.thumbnail img {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

img{
    max-height:100%;
    max-width:100%;
}
#image{
    background: url('images/member_login.jpg') no-repeat center center fixed;
    /*height:400px;*/
    opacity: 0.9;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
#login-image{
    background: url('images/member_register.jpg') no-repeat center center fixed;
    height:400px;
    opacity: 0.9;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

#Signin
  {
    background-image: url("images/30.jpg");
    background-repeat:no-repeat;
    background-size: cover;
    color: #fff;
  }
    
 .row > div > img { width: 100%; display: block; }
p
{
font-size: 18px;
/*font-weight: bold;*/
}
.card {
  /*box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);*/
  max-width: 150px;
  margin: auto;
  text-align: center;
  font-family: arial;
  color: #000;
  /*background-color: #FEF8CD;*/
}
#color-card{
color: black;
}
.card-container {
padding: 0px 16px;
}
.card-container1 {
  padding: 0px 16px;
    border: 1px solid #2F2C75;
    border-radius: 10px;
}

.card-container::after {
  content: "";
  clear: both;
  display: table;
}


.card-button {
  border: none;
  outline: 0;
  display: inline-block;
  padding: 8px;
  color: white;
  background-color:#218cba;
  text-align: center;
  cursor: pointer;
  width: 100%;
  font-size: 18px;
}


.card-button:hover, a:hover {
  opacity: 0.7;
}
 .box1 td
         { 
    padding: 6px;
    width: 200px;
    border: 1px solid #A9A9A9;
    
        } 
       .box1 td:nth-child(odd) {background: #109AF7;font-size: 18px;
    color: white;}
       .box1 td:nth-child(even) {background: #fff ;font-size: 18px;}
       .box2 td
         { 
    padding: 12px;
    width: 200px;
    border: 1px solid #D3D3D3;
    
        } 
       .box2 td:nth-child(even) {background: #F9F00A;}
.content
    {
   
   background-color:#fff;
   /*position: absolute;*/
   width: 100%;
  /* margin-top: 40px;*/
   /*left: 8%;*/

    }
/*.container {
width: 100%;
max-width: 1550px;
}*/
 .content .col-md-2  img
      {
        margin: 10px 0px;
      }
      .youth
    {
   
   background-color: #FCBF26;
   position: absolute;
   width: 100%;
   top: 40px;
   left: 8%;

    }
     .youth .col-md-1 img
      {
        margin: 10px 0px;
      }
      .col-md-1{ margin:0px 25px; }
h1
{
  font-family: 'Varela Round', sans-serif;
}
.image {
  position: relative;
}

.text h1 {
  position: absolute;
  top: 60px;
  left: 40%;
  width: 100%;
  margin: 0 auto;
  width: 300px;
  height: 50px;
}

.navbar {
      margin-bottom: 0;
      background-color: #2f2c75;
      z-index:30;
      border: 0;      
      border-radius: 0;
      font-family: 'Muli', sans-serif;
      width: 100%;
  }
  
  .navbar li a, .navbar .navbar-brand {
      color: #fff !important;
    border-radius:10px;
    font-weight: bold;
      margin: 0px 5px;
  }
  .navbar-nav li a:hover, .navbar-nav li.active a {
      color:#000066 !important;
      background-color:#fff   !important;
  }
  .navbar-default .navbar-toggle {
      border-color: transparent;
      color: #fff !important;
  }

  #banner img
  {
  
  width: 100%;  
  
  }
  #banner
  {
    margin-top: 0%;
  }
#donate
  {
    float: left;
width: 100%;
background-color: #e62e00;
color: #fff;
text-align: center;
}
#donate h1 {
    font-size: 45px;
    font-weight: bold;
}
 #donate h2 {
    font-size: 32px;
    margin-top: 45px;
}
#donate .btn.btn-success
{
  height: 50px;
  width: 150px;
  border-radius: 0px;
  border:none;
  background-color: #fff;
  color: #000;
  margin: 10px 10px 45px 10px;
  font-size: 23px;
  font-weight: bold;
}
#donate .btn.btn-success:hover
{
  background-color: #000;
  color: #fff;
}




#events
{
  background-color: #E0E0E0;
 /*float: left;*/
 width: 100%;
    height: 100%;
}
#events h1{ 
  margin-top: 40px;
  
   }
  
   #events hr
   { 
height: 1px;
background-color: #B8B8B8;
width: 75%;
    }
    .block p
    {
    text-align: center;
    }
    .block2 p,.block3 p
    {
    text-align: none;
    }
    .block3 h1,h3
    {
      line-height: 65%;
    }
    #kadhambam .btn.btn-success
{
  height: 50px;
  width: 250px;
  border-radius: 0px;
  border:none;
  background-color:  #e62e00;
  color: #fff;
  margin: 10px 10px 45px 10px;
  font-size: 20px;
  font-weight: bold;
  margin: 35px 20px;
}
#kadhambam .btn.btn-success:hover
{
  background-color: #000;
  color: #fff;
}
.points li
{
  margin: 4px 0px;
  color: #000;
}

 #school
  {
    float: left;
width: 100%;
background-color: #FCBF28 ;
color: #fff;
text-align: center;

}
#school h1 {
   font-size: 35px;
    font-weight: bold;
    color: #2f2c75;
}
 #school h2 {
    font-size: 33px;
    
}
#gallery
{
 /*float: left;*/
 width: 100%;
  text-align: center;
  color: #fff;
  background-color: #218cba;
}
#gallery hr
   { 
height: 1px;
background-color: #009ba0 ;
}
#gallery img 
{
  margin:15px 0px;
}
#sponsor
{
  color: #000;
  background-color:#fff;
  float: left;
  width: 100%;
  text-align: center;
}
#myCarousel .carousel-control.right, .carousel-control.left {
      background-image: none;
      
  }
  #owl-demo .item{
  margin: 3px;
}
#owl-demo .item img{
  display: block;
  width: 100%;
  height:125px;
  padding: 17px;
}
#owl-demo .carousel-indicators
{ display: none; }

 #anniversary
  {
float: left;
width: 100%;
background-color: #000 ;
color: #fff;

}
#anniversary p
{ line-height: 100%; }
#footer
  {
float: left;
width: 100%;
background-color: #2f2c75 ;
color: #000;
height:100%;
}
h3{
      line-height: 1.5;
}
.event_detail th
{
  text-align: center;
}

.event_detail td
{
  padding: 10px 10px;
  font-size: 22px;
  font-weight: bold;
  text-align: center;
}
.event_detail th
{
  padding: 10px 30px;
}

  @media
  only screen and (max-width: 760px),
  (min-device-width: 768px) and (max-device-width: 1024px)  {

   .event_detail table, thead, tbody, th, td, tr {
      display: block;
    }

    .event_detail thead tr {
      position: absolute;
      top: -9999px;
      left: -9999px;
    }

    .event_detail tr { border: 1px solid #ccc; }

    .event_detail td {
  
      border: none;
      border-bottom: 1px solid #eee;
      position: relative;
      
    }

    .event_detail td:before {
     
      position: absolute;
      top: 6px;
      left: 6px;
      width: 45%;
      padding-right: 10px;
      white-space: nowrap;
    }

    /*
    Label the data
    */
    /*td:nth-of-type(1):before { content: ""; }
    td:nth-of-type(2):before { content: "EVENT NAME"; }
    td:nth-of-type(3):before { content: "EVENT DATE"; }
    td:nth-of-type(4):before { content: "VENUE"; }
    */
  }

  @media only screen
  and (min-device-width : 320px)
  and (max-device-width : 480px) {
   .event_detail body {
      padding: 0;
      margin: 0;
      width: 320px; }
    }

  @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .event_detail body {
      width: 495px;
    }
  }
/*select option {
   
    background: red;
    color: #fff;
    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.4);
}*/
.icons a
{
  padding-left: 7px;
}
.circle{
    font-size: 25px; 
     padding: 12px;
    border-radius: 100%;
}
.topic h4,.posts h4
{
  font-family: sans-serif;
}
.topic
{
    margin-top: 4%;
    margin-left: 3%;
}
.fa-trophy,.fa-comment-o,.fa-gear,.fa-bookmark-o
{
  color: #fff;
}
.stroke {
  -webkit-text-stroke: 1px #F48024;
   font-size: 2.7em;
}
.form-control
{
  
}
.sidebar img
{
  margin:7px 20px;
}
#forum td
{
      padding: 18px 34px 2px 1px;
}
#forumques td
{
      padding: 18px 35px;
}
.contact h3
{
  font-size: 21px;
  line-height: normal;
}


.carousel.vertical .carousel-inner {
  margin-left: 4%;
  height: 250px;
}
.carousel.vertical .item {
  -webkit-transition: 0.6s ease-in-out top;
  -moz-transition:    0.6s ease-in-out top;
  -ms-transition:     0.6s ease-in-out top;
  -o-transition:      0.6s ease-in-out top;
  left:               0;
}
.carousel.vertical .active,
.carousel.vertical .next.left,
.carousel.vertical .prev.right    { top:     0; }
.carousel.vertical .next,
.carousel.vertical .active.right  { top:  100%; }
.carousel.vertical .prev,
.carousel.vertical .active.left   { top: -100%; }        

.register .btn.btn-primary:hover
{
  background-color: #3BB919;
  color: #fff;
  border:none;
 
}
.btn.btn-info:hover
{
  background-color: #000;
  color: #fff;
  border:none;
 
}

.button {
         border-radius: 4px;
         background-color: #fff;
    border: none;
    color: #000;
         text-align: center;
         font-size: 17px;
         height:45px;
         width: 110px;
         transition: all 0.5s;
         cursor: pointer;
         margin: 5px;
         }
         .button span {
         cursor: pointer;
         display: inline-block;
         position: relative;
         transition: 0.5s;
         }
         .button span:after {
         content: '\00bb';
         position: absolute;
         opacity: 0;
         top: 0;
         right: -20px;
         transition: 0.5s;
         }
         .button:hover span {
         padding-right: 17px;
         }
         .button:hover span:after {
         opacity: 1;
         right: 0;
         }

#events .col-md-5,#kadhambam .col-md-4,#school .col-md-4
    {
     
      position: relative;
     overflow: hidden;
   }
 #events .col-md-5 img,#kadhambam .col-md-4 img,#school .col-md-4 img{
    
    max-width: 100%;
  -moz-transition: all 0.3s;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

 #events .col-md-5 img:hover ,#kadhambam .col-md-4 img:hover,#school .col-md-4 img:hover{
 
   -moz-transform: scale(1.1);
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}


.overlay {
  background:#000;
  height: 100%;
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
  width: 100%;
  -moz-transition: opacity, 0.3s;
  -o-transition: opacity, 0.3s;
  -webkit-transition: opacity, 0.3s;
  transition: opacity, 0.3s;
}
.overlays {
  background:#E334A9;
  height: 100%;
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
  width: 100%;
  -moz-transition: opacity, 0.3s;
  -o-transition: opacity, 0.3s;
  -webkit-transition: opacity, 0.3s;
  transition: opacity, 0.3s;
}
.overlay-caption {
  position: absolute;
  text-align: center;
  top: 50%;
  width: 100%;
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
#gallery .col-md-5:hover .overlay {
  opacity: 1;
}
#gallery .col-md-5:hover .overlay p {
  opacity: 1;
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
} 
#current_committee .col-md-3:hover .overlays {
  opacity:0.7;
}
#current_committee .col-md-3:hover .overlay p {
  opacity: 1;
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
} 

.animated {
    
    animation-duration: 1s;
    animation-fill-mode: both;
}

/*.tickets h3,h4,p
{
  line-height: 0.6;
  padding: 0;
  font-weight: bold;
}*/
.price td
{
  padding:4px;
}
input[type=checkbox] {
    zoom: 1.5;
        margin-top: inherit;
}

.checkbox-inline{
      margin-left: 15px;
}
#eventtick
{
      margin-top: -5px;
    margin-left: -14px;

}
.has-feedback .form-control
{
  width: 80%;
}
.form-control-feedback
{
  right: 23%;
}

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

  .navbar-collapse.collapse {
    display: none !important;
  }
  .navbar-collapse.collapse.in {
    display: block !important;
  }
  .navbar-header .collapse, .navbar-toggle {
    display:block !important;
  }
  .navbar-header {
    float: none;
  }

}

 /*
@media (min-width: 768px)
{
.navbar-right .dropdown-menu {
    left: 2px;
    float: right;
}
}
 @media only screen and (min-width : 1200px) {
 #board
 {
  margin-top: 12%;
 }
}

@media only screen and (min-width : 1024px) and (max-width : 1200px) {
  #board
 {
  margin-top: 15%;
 }
    }

@media (min-width : 768px) and (max-width : 1200px) {
  
 #board
 {
  margin-top: 22%;
 }
  
}
 
@media (min-width: 320px) and (max-width: 480px) {
  
 #board
 {
  margin-top: 12%;
 }
  
}
*/
input, select, textarea ,option{
    color: #808080 !important;
    font-weight:  bold !important;
}


 
input:-moz-placeholder { /* Firefox 18- */
color: black !important;  
font-style:  oblique;
}
 
input::-moz-placeholder {  /* Firefox 19+ */
color: black !important;  
font-style:  oblique;
}

input:-ms-input-placeholder {  
color: black !important;  
font-style:  oblique;
}

@media only screen and (max-width: 768px) {
    
#veg1
    {
    width:100px;
    }
#nonveg1
    {
    width:100px;
    }

#kids
    {
    margin-left:40px;
    }

}

@media only screen and (max-width: 400px) {
    
#veg1
    {
    width:80px;
    }
#nonveg1
    {
    width:80px;
    }

#kids
    {
    margin-left:20px;
    }

}