@charset "UTF-8";
@import url(font-awesome.min.css);
@import url("https://fonts.googleapis.com/css?family=Lato:300,700,300italic,700italic");

/*
	Binary by TEMPLATED
	templated.co @templatedco
	Released for free under the Creative Commons Attribution 3.0 license (templated.co/license)
*/
.hover-content{
     position: relative;
    }
    .hover-content .hover-content2:hover::after{
        content:'';
        width:8em;
        height:8em;
        background: url("../../images/wechat2.png") top center;
        background-size:100% auto;
        position:absolute;
        bottom:3em;
        left:-85%;
        z-index:99999;
      }
.ryan{
	display:flex;
	flex-direction: row;
	margin: 2em 0 2em 0;
}
.ryan1{
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.ryan2{
	width: 100%;
	text-align: center;
}
.ryan3{
	width: 100%;
}
.ryan6{
	display: flex;
	position: absolute;
	top:95%;
	left:6%;
	color: rgba(0, 0, 0,0.5);
	z-index: 999;
	margin-bottom: 2em;
}
.ryan5{
	position: relative;
}
.ryan4 a:hover{
	background-color: rgba(255, 255,255, 0);
		
}
.ryan4 a{
	text-decoration: none;
	border: 3px solid rgba(255, 255, 255,0);
	padding: 1em  3em;
	color: rgba(255, 255, 255,0);
}
.ryan7{
	display: flex;
	flex-direction: row;
	margin:0.5em 0 1.5em 0 ;
	padding: 0.5em 0;
	border: 1px solid  rgba(220, 220, 220, 1);
	border-width: 1px 0;
}
.ryan8{
	display: flex;
	position: absolute;
	top:95%;
	left:72%;
	color: rgba(0, 0, 0,0.5);
	z-index: 999;
}
.ryan9{
	display: flex;
	flex-flow: row wrap;
	
}
.ryan10{
	display: flex;
	flex-flow: row;
	position: relative;
}
.ryan11{
	display: flex;
	position: absolute;
	top:42%;
	left:64%;
	color: rgba(0, 0, 0,0.5);
	z-index: 999;
}
.ryan12 a:hover{
	background-color: rgba(255, 255,255, 0);
		
}
.ryan12 a{
	text-decoration: none;
	border: 3px solid rgba(255, 255, 255,0);
	padding: 0.1em  2.5em;
	color: rgba(255, 255, 255,0);
}
.ryan13{
	display: flex;
	position: absolute;
	top:68%;
	left:64%;
	color: rgba(0, 0, 0,0.5);
	z-index: 999;
}