.tutorial-main{width:1062px;padding:60px 0 30px 0;}
.tutorial-main h2 {
  background: #00a9e8 none repeat scroll 0 0;
  border-radius: 30px;
  color: #fff;
  font-family: "Gotham",Helvetica;
  font-size: 18px;
  font-weight: 100;
  height: 30px;
  line-height: 30px;
  margin-bottom: 25px;
  text-align: center;
  width: 223px;
}
.tutorial-main hr {
  border-bottom: medium none;
  border-top: 1px solid #00a9e8;
  margin: -39px 0 39px;
  width: 1024px;
}
.tutorial-header{background:url(../images/header_oeblog.jpg) no-repeat;padding:265px 0 0 0;color:#6a3928;font-size:18px;font-weight:bold;text-align:justify; }
.tutorial-menu{border-left:12px solid #57c3ec; height:12px; line-height:12px; padding:10px 0; width:1060px; background:#eeeef4; margin:12px 0; }
.tutorial-menu-item{color:#7d7d7d; font-size:16px; font-weight:bold; text-align:center; padding:0 5px; border-left:2px solid #fff;float:right;cursor:pointer;}
.tutorial-menu-item:hover, .tutorial-menu-item.selected{color:#57c3ec;}
.tutorial-menu-item.title{border-left:0px;color:#fff;}
.tutorial-menu-item.title b{color:#57c3ec;}

.tutorial-menu-btn { background: none repeat scroll 0 0 #1CB5E3; border: medium none; color: #FFFFFF; cursor: pointer; float: left; font-size: 12px; height: 23px; line-height: 23px; margin: 15px 5px; padding: 0 15px; width: 74px;}
.tutorial-menu-btn:hover{background:#1ba9d4;}
.tutorial-menu-btn a,.tutorial-menu-btn a:visited{color:#fff;
  -webkit-transition: all linear 0s;
     -moz-transition: all linear 0s;
       -o-transition: all linear 0s;
          transition: all linear 0s;}


select{padding:9px 5px;border:1px solid #eeeef4;font-size:12px;font-family:'Gotham',Helvetica;opacity:1;cursor:pointer;height:38px;font-weight:normal;color:#525a63;margin:0 7px 0 0;background:#fff;
-webkit-transition: opacity linear 0.2s;
-moz-transition: opacity linear 0.2s;
-o-transition: opacity linear 0.2s;
transition: opacity linear 0.2s;
float:right;}

select:hover{opacity:1;}
select option{padding:2px 5px;background:#fefefe; color:rgb(17, 17, 17);}

.tutorial-noticia-item-container{width:350px; height:290px; float:left; margin:0 5px 10px 5px;}
.tutorial-noticia-item-container.left{float:left;margin:7px 0 7px 3px;}
.tutorial-noticia-item-container.right{float:right;margin:7px 3px 7px 0;}
.tutorial-noticia-item{cursor:pointer;position:absolute;width:334px; height:274px; background:#eeeef4; padding:8px; }
.tutorial-noticia-item img{width:333px;height:222px;}
.tutorial-noticia-item-fecha { background: none repeat scroll 0 0 #1CB5E3; color: #FFFFFF; font-size: 14px; font-weight: normal; height: 24px; line-height: 24px; margin: 10px 0 0 13px; position: absolute; width: 100px;}
.tutorial-noticia-item-container.inactive{}

.tutorial-noticia-item-tit{color:#363636;font-size:14px;font-weight:normal;text-align:center;margin:10px 0;}

.tutorial-noticia-detalle{width:1072px;} 
.tutorial-noticia-detalle-volanta{margin:5px 0 5px 0;color:#373737;font-size:18px;font-weight:normal;text-align:left;float:left;}
.tutorial-noticia-detalle-fecha{margin:5px 0;color:#57c3ec;font-size:18px;font-weight:normal;text-align:left;float:left;}
.tutorial-noticia-detalle-titulo{margin:5px 0;color:#373737;font-size:24px;font-weight:normal;text-align:justify;}
.tutorial-noticia-detalle-subtitulo{margin:5px 0 15px 0;color:#57c3ec;font-size:12px;font-weight:normal;text-align:justify;}
.tutorial-noticia-detalle-desc{margin:0;color:#373737;font-size:14px;font-weight:normal;text-align:justify;}
.tutorial-noticia-detalle-desc-img{margin:5px 0 10px 0;color:#373737;font-size:12px;font-weight:normal;text-align:justify;}
.tutorial-noticia-imagen-container{ width:535px; min-height:357px; float:left; margin: 0px 25px 5px 0px;}
.tutorial-noticia-imagen{ width:535px; height:357px; border:1px solid #555;   cursor:pointer;}

.tutorial-noticia-detalle-btns{}
.tutorial-noticia-detalle-btn{font-size:12px;font-weight:bold;color:#fff;float:right; margin:0 0 0 5px;height:22px;line-height:22px;padding:0 10px;cursor:pointer;}
.tutorial-noticia-detalle-btn.more{background:#57c3ec;}
.tutorial-noticia-detalle-btn.sizeup{background:#989898;font-size:14px;}
.tutorial-noticia-detalle-btn.sizedwn{background:#989898;font-size:11px;}

.tutorial-noticia-bullet-container{margin:25px 0;}
.tutorial-noticia-bullet{float:left;width:30px;height:30px;margin:2px;background:url(../images/bullet.png) no-repeat -62px center;}
.tutorial-noticia-bullet:hover{background:url(../images/bullet.png) no-repeat -31px center;cursor:pointer;}
.tutorial-noticia-bullet.active{background:url(../images/bullet.png) no-repeat 0px center;cursor:default;}

.tutorial-noticia-detalle-btn-top{background:#f2f2f2;  border: 1px solid #CCCCCC;  color: #8D8D8D;  cursor: pointer;  float: left;  font-size: 16px;  font-weight: bold;  height: 20px;  line-height: 17px;  margin: 10px 5px 5px 0;  text-align: center;  width: 30px;}
.tutorial-noticia-detalle-btn-top:hover{background:#e8e8e8;box-shadow: 0px 0px 2px #ccc;color: #666;}
.tutorial-noticia-detalle-btn-top.prev{}
.tutorial-noticia-detalle-btn-top.next{}

.tutorial-foto-item-container{width:181px; height:150px; float:left; margin:17px 19px 17px 15px;}
.tutorial-foto-item{cursor:pointer;position:absolute;width:173px; height:150px; background:#eeeef4; padding:10px; }
.tutorial-foto-item.selected{box-shadow: 0px 0px 4px #00f;}
.tutorial-foto-item-tit{color:#363636;font-size:11px;font-weight:normal;text-align:center;margin:10px 0;}
.tutorial-foto-container{background:#eeeef4;height: 500px; padding: 8px 5px; width: 1040px;margin:20px 0 0 0;}
.tutorial-foto-container-img {float: left; border: 1px solid #222222; height: 99px; margin: 7px; padding: 2px; width: 148px;}
.tutorial-foto-container-img:hover{border: 1px solid #57c3ec;}


.tutorial-play-youtube {
  background: rgba(0, 0, 0, 0) url("../images/icon_play_youtube.png?a=1") no-repeat scroll center center / auto 35%;
  height: 90%;
  opacity: 0.8;
  position: absolute;
  transition: opacity 0.2s linear 0s;
  width: 94%;
}
.tutorial-play-youtube:hover{
  opacity: 1;
  transition: opacity linear 0.2s;	
}

.tutorial-video-item-container { 
  min-height: 500px;
  width: 1062px;
  position: relative;
  
}
.tutorial-video{
	width: 322px;
	height: 322px;
	float: left;
	margin: 16px;
    -webkit-perspective: 2000px;
       -moz-perspective: 2000px;
         -o-perspective: 2000px;
            perspective: 2000px
}
.tutorial-video-item {
  height: 322px;
  -webkit-transition: -webkit-transform .65s;
     -moz-transition: -moz-transform .65s;
       -o-transition: -o-transform .65s;
          transition: transform .65s;
  -webkit-transform-style: preserve-3d;
     -moz-transform-style: preserve-3d;
       -o-transform-style: preserve-3d;
          transform-style: preserve-3d;
  width: 322px;
}

.tutorial-video-item .front, .tutorial-video-item .back {
  -webkit-backface-visibility: hidden;
     -moz-backface-visibility: hidden;
       -o-backface-visibility: hidden;
          backface-visibility: hidden;
  display: block;
  height: 322px;
  margin: 0;
  position: absolute;
  width: 322px;
  border-sizing:box;
}

.tutorial-video-item .front {
  border: 1px solid #ccc;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;  
  color: #fff;
  font-size: 25px;
  font-weight: bold;
  line-height: 29px;
  padding: 15px 20px;
  text-align: left;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.4);
}

.tutorial-video-item .back {
  background: #fff none repeat scroll 0 0;
  border: 2px solid #848484;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;  
  color: #131313;
  padding: 16px 20px;
  text-align: left;
  -webkit-transform: rotateY( 180deg );
     -moz-transform: rotateY( 180deg );
       -o-transform: rotateY( 180deg );
          transform: rotateY( 180deg );
}
.tutorial-video-item .back h4 {
  font-size: 25px;
  line-height: 26px;
  margin: 0;
}
.tutorial-video-item .back p {
  font-size: 18px;
  height: 185px;
  line-height: 18px;
}
.tutorial-video-item.flipped {
   -webkit-transform: rotateY( 180deg );
      -moz-transform: rotateY( 180deg );
        -o-transform: rotateY( 180deg );
           transform: rotateY( 180deg );
}
.tutorial-video-item .play {
  background: rgba(0, 0, 0, 0) url("../images/ico_play_blue.png?a=2") no-repeat scroll left center;
  color: #0098d3;
  cursor: pointer;
  font-size: 18px;
  font-weight: normal;
  height: 32px;
  line-height: 32px;
  opacity: 0.8;
  padding: 0 0 0 36px;
  position: absolute;
  transition: opacity 0.2s linear 0s;
  width: 150px;
}
.tutorial-video-item .play:hover{
  opacity: 1;	
}


.fancybox-wrap {
  top: 100px !important;
}
