@import url(https://fonts.googleapis.com/css?family=Raleway:400,800);
@media screen and (min-width:1200px){		
figure.snip1091{
  position: relative;
  display: inline-block;
  margin:2% 6.8%;
  width:36%;
  overflow: hidden;
  background: #000000;
  box-shadow: 5px 1px 5px 5px rgba(0, 0, 0, 0.1);
}
figure.snip1091 img{
  opacity: 0.25;
  width: 100%;
  position: relative;
  top: 0;
  left: 0;
}
.man_btn_box{
	position:relative;
	width:46%;
	height:65px;
	float:right;
	margin:1% auto;
}
.man_btn{
	float:left;
	color:#fff;
	margin:1%;
	padding:1%;
	font-size:.8em;
	text-align:center;
	border-radius:5px 5px 5px 5px;
	box-shadow:0px 5px 2px 0px #1365b7;
	background:#3CC;
}
.man_l ul{
	margin: 0 2% 2% 2%;
	padding:0 2%;
	clear:both;
}
.man_l_in{
	float:left;
	width:30%;
	margin:0 1% 2% 1%;
    overflow: auto;
    height: 350px;
}
.man_in h2{
	color: #65e9f9;
	font-size: 1em;
	line-height:1.5em;
	height:1.5em;
	margin:0;
	font-weight:lighter;
}
}
@media screen and (max-width:1200px){
figure.snip1091{
  position: relative;
  margin:5% auto;
  width:85%;
  overflow: hidden;
  background: #000000;
  box-shadow: 5px 10px 10px 5px rgba(0, 0, 0, 0.2);
}
figure.snip1091 img{
  opacity: 0.25;
  width: 100%;
  position: relative;
  top: 0;
  left: 0;
}
.man_btn_box{
	position:relative;
	width:100%;
	height:80px;
	margin:5% auto;
}
.man_btn{
	float:left;
	color:#fff;
	margin:1%;
	padding:1%;
	width:96%;
	font-size:1.2em;
	text-align:center;
	border-radius:5px 5px 5px 5px;
	box-shadow:0px 5px 2px 0px #1365b7;
	background:#3CC;
}
.man_l ul{
	margin: 0 2% 2% 2%;
	padding:0 5%;
	clear:both;
}
.man_l_in{
	width:96%;
	margin:0 2%;
	padding:2% 0;
	background: rgba(51, 51, 51, 0.41);
}
.man_r{margin:10% 0 0 0;}
.man_in h2{
	color: #65e9f9;
	font-size: 1em;
	line-height:1.5em;
	margin:0;
	font-weight:lighter;
}
}
figure.snip1091 *{
  -webkit-transition: all 0.35s ease-in-out;
  transition: all 0.35s ease-in-out;
}
figure.snip1091 figcaption{
  position: absolute;
  top: 50%;
  left: 30px;
  right: 30px;
  -webkit-transform: rotate(0deg) translateY(-50%) scale(1);
  transform: rotate(0deg) translateY(-50%) scale(1);
  -webkit-transform-origin: center 0;
  transform-origin: center 0;
}
figure.snip1091 figcaption h2{
  top: 50%;
  letter-spacing: -1px;
  color: #ffffff;
  text-transform: uppercase;
  padding: 2% 0;
  margin: 0;
  font-weight: 400;
  text-align:center;
  font-size:1.5em;
  line-height:1.2em;
}
figure.snip1091.blue{background: #091b27;}
figure.snip1091.red{background: #2e0e0a;}
figure.snip1091.yellow{background: #4f3204;}
figure.snip1091.green{background: #061c10;}
figure.snip1091.navy{background: #000000;}
figure.snip1091:hover img,figure.snip1091.hover img{opacity: 1;}
figure.snip1091:hover figcaption:before,figure.snip1091.hover figcaption:before,figure.snip1091:hover figcaption:after,figure.snip1091.hover figcaption:after{width: 200%;}
@import url(https://fonts.googleapis.com/css?family=Lato:300,400,900);
.modal{
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);
  display: inline-block;
  padding: 1em;
  position:absolute;
  top:60%;
  right:1vw;
}
.modal > label{
  background: #FFD300;
  border: 1px solid #f0c600;
  border-radius: .2em;
  color: #000000;
  cursor: pointer;
  display: inline-block;
  font-weight: bold;
  padding: 0.4em;
  text-shadow: 1px 1px 1px #fff;
  transition: all 0.55s;
}
.modal > label:hover,.modal input:focus ~ label{transform: scale(0.97);}
.popbg1{background: url(../images/oem/pop_bg1.jpg) #000 no-repeat center bottom;}
.popbg2{background: url(../images/oem/pop_bg2.jpg) #000 no-repeat center bottom;}
.popbg3{background:#000;}
.popbg4{background: url(../images/oem/pop_bg4.jpg) #000 no-repeat center bottom;}
.popbg5{background: url(../images/oem/pop_bg5.jpg) #000 no-repeat center bottom;}
.popbg6{background: url(../images/oem/pop_bg6.jpg) #000 no-repeat center bottom;}
.modal__overlay{
  bottom: 0;
  left: 0;
  position: fixed;
  right: 0;
  text-shadow: none;
  top: 0;
  z-index: 600;
}
.modal__overlay{
  opacity: 0;
  z-index: -100;
  transform: scale(0.5);
  transition: all 0.75s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.modal__wrap p{
  color: #ccc;
  text-align: justify;
  font-size:1em;
  line-height:2em !important;
  margin:0;
}
.modal__wrap .man_txt{
  color: #ccc;
  text-align: justify;
  font-size:1em;
  line-height:2em !important;
  margin:2%;
}
.modal__wrap h3{
  color: #FFD300;
  text-transform: uppercase;
  font-size:1.5em;
  font-weight:lighter;
  line-height:1.5em;
  border-bottom:1px solid #666;
  margin:1%;
  clear:both;
}
input{
  position: absolute;
  top: -5000px;
}
input:checked ~ .modal__overlay{
  opacity: 1;
  transform: scale(1);
  z-index: 800;
}
.man_l{
	color:#fff;
	line-height:2em;
	clear:both;
	background: rgba(45, 66, 86, 0.68);
	border-bottom: 3px solid #ffd300;
}
.man_l ul li{list-style-type:square;}
.man_in ul{
	list-style-type: square;
	height:25%;
	display: block;
	clear:both;
	margin:0 0 5% 0;
	padding:0 5%;
	color:#ccc;
	line-height:1.8em;
	font-size:.9em;
}
.man_in_img{width:100%;clear:both;}
.man_in_box{clear:both;}
.man_l_in p{
	color: #65e9f9;
	font-size: 1.2em;
	line-height: 1em !important;
	text-align:center;
}
.man_l_in ul{
	list-style-type: none;
	display: block;
	clear:both;
	padding:0 8%;
	color:#fff;
	line-height:2.2em;
	font-size:.9em;
	text-align:center;
	margin:4% auto;
	border-top:1px solid #333;
	border-bottom:1px solid #333;
}
.man_btn:hover{
	-webkit-transform: scale(0.9);
	transform: scale(0.9);
	-webkit-transition: -webkit-transform 0.3s ease, opacity 0.3s ease;
	transition: transform 0.3s ease, opacity 0.3s ease;
	background: #39F;
}
.man_btn:active{
	-webkit-transform: scale(0.9);
	transform: scale(0.9);
	-webkit-transition: -webkit-transform 0.3s ease, opacity 0.3s ease;
	transition: transform 0.3s ease, opacity 0.3s ease;
	background:#3CC;
}
.man_r img,.man_in img,.ma_txt img,.man_l_icon img,.man_r_icon img{
	width:100% !important;
	height:100% !important;
}
.man_l_icon{
	position:absolute;
	top:65%;
	left:-4%;
}
.man_r_icon{
	position:absolute;
	top:65%;
	right:-4%;
}