/*
Template Name:Charity Show
File: Layout CSS
Author: Templates On Web
Author URI: http://templateonweb.com/
Licence: <a href="http://www.templateonweb.com/terms.php?v=content&contentid=152">Website Template Licence</a>
*/

/********************* about_main ****************/
#about_main{ 
 background-image: url(../img/31.jpg);
 padding-bottom: 180px;
 padding-top: 180px;
 background-repeat: no-repeat;
 background-size: cover;
 }
.about_main_1{ 
 background-color: #f9b03eb0;
 width: 30%;
 text-align: center;
 padding: 15px 20px 2px 10px;
 }
.about_main_1 h2{ 
 color: #fff;
 font-weight:bold;
 }
.about_main_1 i{ 
 color: #fff;
 padding-left:5px;
 }
.about_main_1 p a{ 
 color: #fff;
 }
.about_main_1 p a:hover{ 
 color: #fff;
 }
/********************* about_main_end ****************/
/********************* about ****************/
#about{ 
  padding-top:30px;
  padding-bottom:30px;
  background-color: #f2f2f2;
 }
.about_1 h2{ 
  font-size:30px;
  font-weight:bold;
  color: gray;
 }
.about_2{ 
  float:right;
 }
.about_2 a i{ 
  font-size:40px;
  color:#eb1c24;
 }
.about_3 h4{ 
  text-align:center;
  font-size:25px;
  font-weight:bold;
  padding-bottom:30px;
 }
.about_4 p{ 
  line-height:25px;
 }
.hr_3{ 
 border-top: 1px solid #fabd5d;
 border-width: 3px;
 width: 6%;
 margin: 0px;
 margin-bottom: 10px;
 }
/********************* about_end ****************/
/********************* news ****************/
#news{ 
 padding-top:30px;
 padding-bottom:30px;
 background-color:#f1f1f1;
 }
.news_2 h4{ 
 padding-bottom:5px;
 }
.news_2 h2{ 
 padding-bottom:10px;
 }
.news_3{ 
 float:right;
 }
.news_3 h4{ 
 border: 5px solid #000;
 padding: 15px 15px 15px 15px;
 }
.news_3 h4:hover{ 
 background-color:#000;
 color:#fff;
 }
.news_5{ 
 padding-top:30px;
 }
.news_6{ 
 text-align:center;
 background-color:#fff;
 padding: 15px 15px 15px 15px;
 box-shadow: 0 0 2px #827e7e;
 }
.news_6 h4{ 
 color: #707787;
 padding-bottom:5px;
 }
.news_6 h3{ 
 font-weight:bold;
 padding-bottom:10px;
 }
.news_6 li{ 
 display:inline;
 margin-right:10px;
 }
.news_6 li a{ 
 font-size:18px;
 color: #f9b64d;
 }
.news_6 li a:hover{ 
 color: #000;
 }
/********************* news_end ****************/
/********************* updates ****************/
#updates{ 
 background-color: #212136;
    }
.updates_1 p{ 
 color: #222222;
font-size:30px;
line-height: 1.8;
letter-spacing:3px;
padding-top:50px;
padding-bottom:50px;
    }
#updates .row{
   margin-bottom:20px;
   }
#updates .ih-item {
  position: relative;
  -webkit-transition: all 0.35s ease-in-out;
  -moz-transition: all 0.35s ease-in-out;
  transition: all 0.35s ease-in-out;
}
#updates .ih-item,
#updates .ih-item * {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
#updates .ih-item a {
  color: #333;
}
#updates .ih-item a:hover {
  text-decoration: none;
}
#updates .ih-item img {
  width: 100%;
  height: 100%;
}

#updates .ih-item.square {
  position: relative;
  width: 225px;
  height: 216px;
}
#updates .ih-item.square .info {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  text-align: center;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

#updates .ih-item.square.effect10 {
  overflow: hidden;
}
#updates .ih-item.square.effect10.colored .info {
  background: #1a4a72;
}
#updates .ih-item.square.effect10.colored .info h3 {
  background: rgba(12, 34, 52, 0.6);
}
#updates .ih-item.square.effect10 .img {
  -webkit-transition: all 0.35s ease-in-out;
  -moz-transition: all 0.35s ease-in-out;
  transition: all 0.35s ease-in-out;
}
#updates .ih-item.square.effect10 .info {
  background: #333333;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: all 0.35s ease-in-out;
  -moz-transition: all 0.35s ease-in-out;
  transition: all 0.35s ease-in-out;
}
#updates .ih-item.square.effect10 .info h3 {
  text-transform: uppercase;
  color: #fff;
  text-align: center;
  font-size: 17px;
  padding: 10px;
  background: #111111;
  margin: 30px 0 0 0;
}
#updates .ih-item.square.effect10 .info p {
  font-style: italic;
  font-size: 14px;
  position: relative;
  color: #bbb;
  padding: 20px 20px 20px;
  text-align: center;
}
#updates .ih-item.square.effect10 a:hover .info {
  visibility: visible;
  opacity: 1;
}
#updates .ih-item.square.effect10.left_to_right .img {
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  transform: translateX(0);
}
#updates .ih-item.square.effect10.left_to_right .info {
  -webkit-transform: translateX(-100%);
  -moz-transform: translateX(-100%);
  -ms-transform: translateX(-100%);
  -o-transform: translateX(-100%);
  transform: translateX(-100%);
}
#updates .ih-item.square.effect10.left_to_right a:hover .img {
  -webkit-transform: translateX(100%);
  -moz-transform: translateX(100%);
  -ms-transform: translateX(100%);
  -o-transform: translateX(100%);
  transform: translateX(100%);
}
#updates .ih-item.square.effect10.left_to_right a:hover .info {
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  transform: translateX(0);
}
/********************* updates_end ****************/
/********************* links ****************/
#links{ 
 background-image: url(../img/33.jpg);
 background-repeat: no-repeat;
 background-size: cover;
 background-attachment: fixed;
 }
.links_main{ 
 padding-top:100px;
 padding-bottom:100px;
 background-color: #000000ba;
 }
.links_1{ 
 text-align:center;
 }
.links_1 h4{ 
 color:#fff;
 padding-bottom:5px;
 }
.links_1 h2{ 
 color:#fff;
 }
.hr_4{
 margin-top: 20px;
 margin-bottom: 20px;
 border-top: 1px solid #f9b03e;
 border-width: 2px;
 width: 4%;
}
.links_1 ul {
 padding-top:20px;
 padding-bottom:40px;
}
.links_1 li {
 display: inline;
 padding-right: 10px;
}
.links_1 li a:hover {
 border: 3px solid #fff;
 color: #fff;
}
.links_1 li a {
 border: 3px solid rgba(255, 255, 255, 0.3);
 padding: 10px 30px;
 font-size: 18px;
 color: #fff;
}
/********************* links_end ****************/





@media screen and (max-width : 767px){
#about_main {
 padding-bottom: 80px;
 padding-top: 80px;
}
.about_main_1 {
 width: 100%;
}
#about {
 text-align: center;
}
.hr_3 {
 width: 100%;
}
.links_main {
 padding-top: 50px;
 padding-bottom: 50px;
}
.links_1 li a {
 padding: 10px 10px;
 font-size: 15px;
}
.links_1 li {
 padding-right: 1px;
}
#news {
 text-align: center;
}
.news_3 {
 float: none;
}
#updates .ih-item.square {
 width: 100%;
 height: 100%;
}
}


@media (min-width:470px) and (max-width:767px) {

}
 
 
@media (min-width:768px) and (max-width:961px) {
#updates .ih-item.square {
 width: 100%;
 height: 100%;
}
#updates .ih-item.square.effect10 .info p {
 font-size: 6px;
 padding: 5px 20px 20px;
}
#updates .ih-item.square.effect10 .info h3 {
 font-size: 15px;
}
} 

 
@media (min-width:962px) and (max-width:1200px) {
#updates .ih-item.square {
 width: 100%;
 height: 100%;
}
#updates .ih-item.square.effect10 .info p {
 font-size: 6px;
 padding: 5px 20px 20px;
}
#updates .ih-item.square.effect10 .info h3 {
 font-size: 15px;
}
}

@media (min-width:1201px) and (max-width:1320px) {
#updates .ih-item.square {
 width: 100%;
 height: 100%;
}
#updates .ih-item.square.effect10 .info p {
 font-size: 13px;
 padding: 5px 20px 20px;
}
}