@charset "utf-8";
/* CSS Document */

body{
	min-height: 100% !important;
	}


.clear{ 
	clear:both; 
	display:block
}
#main{
	width:100%;
	height:auto;
	min-height:100%;
	background:url(../images/bg.jpg) center center no-repeat fixed;
	position:fixed;
	display:block;
	background-size: cover;
	overflow: hidden;
}
#main .content{
	width:554px;
	margin:auto;
	display:block;
	position:relative;
	box-sizing:border-box;
	padding-top:22%;
	
}
#main .content .left,#main .content .right{
	
	width: 277px;
	float:left;
	display: inline-block;
	position:relative;
	-webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
#main .content .left > a .image{
	background: rgb(237,28,36);
	background: -moz-linear-gradient(top,  rgba(237,28,36,1) 0%, rgba(234,68,73,1) 50%, rgba(234,32,39,1) 51%, rgba(196,0,9,1) 100%);
	background: -webkit-linear-gradient(top,  rgba(237,28,36,1) 0%,rgba(234,68,73,1) 50%,rgba(234,32,39,1) 51%,rgba(196,0,9,1) 100%);
	background: linear-gradient(to bottom,  rgba(237,28,36,1) 0%,rgba(234,68,73,1) 50%,rgba(234,32,39,1) 51%,rgba(196,0,9,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ed1c24', endColorstr='#c40009',GradientType=0 );
	width:277px;
	height:177px;	
	border-radius: 13px 0 0 13px;
	box-shadow: 0 0 13px rgba(0,0,0,0.2);
	-webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
#main .content .left > a:hover .image,#main .content .right > a:hover .image{
	background: rgb(237,28,36);
	background: -moz-linear-gradient(top,  rgba(237,28,36,1) 0%, rgba(234,68,73,1) 50%, rgba(234,32,39,1) 51%, rgba(196,0,9,1) 100%);
	background: -webkit-linear-gradient(top,  rgba(237,28,36,1) 0%,rgba(234,68,73,1) 50%,rgba(234,32,39,1) 51%,rgba(196,0,9,1) 100%);
	background: linear-gradient(to bottom,  rgba(237,28,36,1) 0%,rgba(234,68,73,1) 50%,rgba(234,32,39,1) 51%,rgba(196,0,9,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ed1c24', endColorstr='#c40009',GradientType=0 );
	-webkit-animation: heartbeat 1.5s ease-in-out both;
	        animation: heartbeat 1.5s ease-in-out both;

}

#main .content .right > a .image{
	background: rgb(237,28,36);
	background: -moz-linear-gradient(top,  rgba(237,28,36,1) 0%, rgba(234,68,73,1) 50%, rgba(234,32,39,1) 51%, rgba(196,0,9,1) 100%);
	background: -webkit-linear-gradient(top,  rgba(237,28,36,1) 0%,rgba(234,68,73,1) 50%,rgba(234,32,39,1) 51%,rgba(196,0,9,1) 100%);
	background: linear-gradient(to bottom,  rgba(237,28,36,1) 0%,rgba(234,68,73,1) 50%,rgba(234,32,39,1) 51%,rgba(196,0,9,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ed1c24', endColorstr='#c40009',GradientType=0 );
	width:277px;
	height:177px;	
	border-radius: 0 13px 13px 0;
	box-shadow: 0 0 13px rgba(0,0,0,0.2);
	-webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}


#main .content .left > a .image img{
	
	width: 34%;
	margin: auto;
	display: block;
	padding-top: 3%
}
#main .content .right > a .image img{
	
	width: 80%;
	margin: auto;
	display: block;
	padding-top: 15%
}

#main .content .left > a .image h2,#main .content .right > a .image h2{
	
	font-size: 19px;
	font-weight: 800;
	color: #fff;
	text-align: center;
	font-family: "Montserrat", sans-serif;
	text-transform: uppercase;
	padding: 10px 0
}
#main .content .left > a .image h5,#main .content .right > a .image h5{
	
	font-size: 13px;
	font-weight: 400;
	color: #fff;
	text-align: center;
	font-family: "Montserrat", sans-serif;
	text-transform: capitalize;
	padding: 10px 0;
	position: relative
}
#main .content .right > a .image h5:after{
	
	content:"";
	position: absolute;
	left: 74%;
	top: 50%;
	background: url("../images/arrow-right.svg") no-repeat;
	width: 10px;
	height: 10px;
	background-size: cover;
	transform: translate(-50%,-50%);
}
#main .content .left > a .image h5:after{
	
	content:"";
	position: absolute;
	left: 74%;
	top: 50%;
	background: url("../images/arrow-right.svg") no-repeat;
	width: 10px;
	height: 10px;
	background-size: cover;
	transform: translate(-50%,-50%);
}

.rotate-center {
	-webkit-animation: rotate-center 0.6s ease-in-out both;
	        animation: rotate-center 0.6s ease-in-out both;
}

.flip-scale-up-hor {
	-webkit-animation: flip-scale-up-hor 0.5s linear both;
	        animation: flip-scale-up-hor 0.5s linear both;
}

.heartbeat {
	-webkit-animation: heartbeat 1.5s ease-in-out both;
	        animation: heartbeat 1.5s ease-in-out both;
}
/* ----------------------------------------------
 * Generated by Animista on 2019-11-19 17:24:56
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation rotate-center
 * ----------------------------------------
 */
@-webkit-keyframes rotate-center {
  0% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@keyframes rotate-center {
  0% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}


/* ----------------------------------------------
 * Generated by Animista on 2019-11-19 17:43:47
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation flip-scale-up-hor
 * ----------------------------------------
 */
@-webkit-keyframes flip-scale-up-hor {
  0% {
    -webkit-transform: scale(1) rotateX(0);
            transform: scale(1) rotateX(0);
  }
  50% {
    -webkit-transform: scale(2.5) rotateX(-90deg);
            transform: scale(2.5) rotateX(-90deg);
  }
  100% {
    -webkit-transform: scale(1) rotateX(-180deg);
            transform: scale(1) rotateX(-180deg);
  }
}
@keyframes flip-scale-up-hor {
  0% {
    -webkit-transform: scale(1) rotateX(0);
            transform: scale(1) rotateX(0);
  }
  50% {
    -webkit-transform: scale(2.5) rotateX(-90deg);
            transform: scale(2.5) rotateX(-90deg);
  }
  100% {
    -webkit-transform: scale(1) rotateX(-180deg);
            transform: scale(1) rotateX(-180deg);
  }
}

/* ----------------------------------------------
 * Generated by Animista on 2019-11-19 17:47:10
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation heartbeat
 * ----------------------------------------
 */
@-webkit-keyframes heartbeat {
  from {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-transform-origin: center center;
            transform-origin: center center;
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  10% {
    -webkit-transform: scale(0.91);
            transform: scale(0.91);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  17% {
    -webkit-transform: scale(0.98);
            transform: scale(0.98);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  33% {
    -webkit-transform: scale(0.87);
            transform: scale(0.87);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  45% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
}
@keyframes heartbeat {
  from {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-transform-origin: center center;
            transform-origin: center center;
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  10% {
    -webkit-transform: scale(0.91);
            transform: scale(0.91);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  17% {
    -webkit-transform: scale(0.98);
            transform: scale(0.98);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  33% {
    -webkit-transform: scale(0.87);
            transform: scale(0.87);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  45% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
}




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

	
	#main .content .left, #main .content .right{
		
		width: 100%;
		float: none;
		display: block;
		margin: auto;
		margin-top: 5%
	}
	#main .content .left > a .image,#main .content .right > a .image{
		
		width: 90%;
		margin: auto;
		border-radius: 13px
	}
	#main .content{
		
		width: 100%
	}
	
}