@charset "UTF-8";
/*!
 *
 * Dangoor Theme
 *
 */
 
 body {
	 background-color: #f2f2f2;
 }
 
 .container-fluid {
	 max-width: 1600px;
 }
 
 .banner {
	 background-image: url(img/dangoor-banner_1200px.png);
	 background-size: cover;
	 background-repeat: no-repeat;
	 height: 35vh;
	 text-align: center;
	 white-space: nowrap;
 }
 
 .vertical-center {
    display: inline-block;
    height: 100%;
    vertical-align: middle;
 }

 #introduction {
	 margin: 25px auto 40px;
	 width: 100%;
	 text-align: center;
 }
 
 #introduction h1 {
	 background: url(img/dangoor-underline_90px.png) no-repeat 50% 100%;
	 line-height: 1.5;
	 padding-bottom: 10px;
	 color: #616160;
	 font-size: 1.5rem;
 }
 
  #introduction p {
	 margin-top: 30px;
	 color: #868888;
 }

 .banner img{
	 width: 34%;
	 max-width: 650px;
	 vertical-align: middle;
 }
 
  .activity_container {
	 margin-bottom: 40px;
 }

 .activity {
	 margin-top: 20px;
 }

 
 @media screen and (min-width: 1500px) {
	.activity_container {
	 	width: 1600px;
 	}
 
	.activity {
		width: 300px;
	}
 }
 
  @media screen and (min-width: 1600px) {
	.activity_container {
	 	margin-left: 40px;
 	}
 }
 
 .logo {
	 height: 10em;
	 text-align: center;
	 background-color: #FFF;
 }
 
 .logo, .activity-name {
	  margin: 5px;
	-webkit-box-shadow: 0px 0px 15px -7px rgba(0,0,0,0.46);
-moz-box-shadow: 0px 0px 15px -7px rgba(0,0,0,0.46);
box-shadow: 0px 0px 15px -7px rgba(0,0,0,0.46);
  }
  
 .logo img {
	 max-height: 125px;
	 padding: 10px;
	 vertical-align: middle;
 }
 
 .logo img {
	 -o-transition: .4s ease-out;
  	 -ms-transition:.4s ease-out;
  	 -moz-transition: .4s ease-out;
  	 -webkit-transition: .4s ease-out;
  	 /* ...and now override with proper CSS property */
 	 transition: .4s ease-out;
 }
 
 .activity-name {
	 height: 7em;
	 background-color: #FFF;
	 -o-transition:.3s;
  	 -ms-transition:.3s;
 	 -moz-transition:.3s;
 	 -webkit-transition:.3s;
 	 transition:.3s;
 }
 
  .activity-title {
	 width: 100%;
	 height: 100%;
	 display: block;
	 text-align: center;
 }
 
  .activity-name h2{
	 text-align: center;
	 font-size: 1.3rem;
	 font-weight: 300;
	 line-height: 1.3;
	 padding: 0 15px;
	 margin-bottom: 0.1em;
	 color: #616160;
 }
 
.activity-name p{
	 color: #00733F;
 }
 
 a h2,
 a p {
	  -o-transition:color .3s ease-out;
  	 -ms-transition:color .3s ease-out;
  	 -moz-transition:color .3s ease-out;
  	 -webkit-transition:color .3s ease-out;
  	 /* ...and now override with proper CSS property */
 	 transition:color .3s ease-out;
 }
 
  a h2:visited {
	  text-decoration: none;
 }
 
 #wrapper-footer {
	 background-color: #00733F;
 }
 
 .site-info {
	 text-align: center;
	 color: #FFF;
	 margin: 50px 10px;
	 font-weight: 400;
 }
 
 #video-corner img {
 	position: absolute;
	top: 5px;
	left: 20px;
 }
 
 .relative-center {
	position: relative;
	top: 50%;
	transform: translateY(-50%);
 }
 
 @media screen and (max-width: 1200px) {
	.activity-name h2 {
		font-size: 1.1rem;
	}
 }
 
  @media screen and (max-width: 768px) {
	 .banner img{
	 	width: 60%;
 	}
	
	 .site-info {
	 	margin: 30px 10px;
 	}
	
	 #video-corner img {
		top: 0;
 	}
	
	.read-more {
		display: block;
 	}
	
	.activity-name p{
	 	display: block;
 	}
	
 }
 
  @media screen and (max-width: 554px) {
	  .banner {
	 	height: 25vh;
 	}
 }
 
 a:hover{
	 text-decoration: none;
 }
 
 a h2:hover,
 a .activity-name:hover h2,
 a .activity-name:hover p { 
 	color: #fff;
 }
 
 a .activity-name:hover {
	 background-color: #00733F;
 }
 
  a .logo img:hover {
	 max-height: 70%;
	 max-width: 80%;
 }

