/*remove the line 7 the height*/
/*remove the line 42 change the bg*/
/*remove the line 94 change the bg*/

body, html{width: 100%; height: 100%;}
body{font-family: 'Roboto', sans-serif;background-color: #ffffff;  font-size: 16px; color: #000000;}

.wrapper{width: 100%;}
.title-page{width: 100%; background-color: #102048; border-bottom: 1px solid #ccc; background-position: top center;}
.title-page{width: 100%; position: relative;  background-position: top center; }
.cont-pages{width: 100%; margin: 0 auto; width: 100%; padding: 0px 0 0px;  max-width: 920px;}
.cont-pages img{max-width: 100%;}
.page_disclaimer{width: 100%; padding: 30px 0; position: relative;}
.cont-disclaimer{width: 100%; max-width: 980px; margin: 0 auto;}
.cont-disclaimer h5{font-size: 18px; font-family: 'Roboto', sans-serif; text-transform:uppercase;  text-align: left; line-height: 20px; padding: 0px 0 10px; font-weight: bold;}
.cont-disclaimer p{padding: 0 0 20px; text-align: justify; font-size: 16px; line-height: 20px;}
.cont-disclaimer p a{color: #0000ff; text-decoration: underline; font-weight: bold;}
.page_disclaimer2{width: 100%;   position: relative;}
.cont-disclaimer2{width: 100%;  max-width: 980px; margin: 0 auto; padding: 70px 0 40px;}
.cont-disclaimer2 h5{font-size: 18px; font-family: 'Roboto', sans-serif; text-transform:uppercase;  text-align: left; line-height: 20px; padding: 0px 0 10px; font-weight: bold;}
.cont-disclaimer2 p{padding: 0 0 20px; text-align: justify; font-size: 16px; line-height: 20px;}
.cont-disclaimer2 p a{color: #0000ff; text-decoration: underline; font-weight: bold;}
.cont-disclaimer2 ul{padding: 0 0 0 20px;}
.cont-disclaimer2 ul li{list-style: disc; font-size: 16px; line-height: 22px; padding: 0 0 15px 0px;}
.chapter{width: 100%; margin: 0 auto; margin-top: 35px; max-width: 131px; height:74px; background: url(../img/chapterbubble.png) no-repeat; background-size: 131px 74px;}
.chapter h2{font-size: 19px; color: #ffffff; font-weight: bold; padding: 20px 0 0; letter-spacing: 2px; font-family: 'Roboto', sans-serif; text-transform:uppercase; text-align: center;}
.tableContents{width: 100%; height: 100%;}
.cont-table{width: 100%; max-width: 900px; margin: 0 auto;}
.cont-table h1{text-align: left; font-family: 'Roboto', sans-serif; text-transform:uppercase; font-weight: bold; font-size: 26px; padding: 15px 0 30px; box-sizing: border-box;}
.cont-table ul{padding: 0 0 0 30px;}
.cont-table ul li{list-style: decimal; font-size: 22px; padding: 0 0 0px;}
.cont-table ul li a{text-decoration: none; color: #000000; display:block;}

#copyright{margin: 30px auto 0;} /*styles to copyright in the footer*/
#copyright p{text-align: center !important;}

.title-content{width: 100%; padding: 0 0 20px; box-sizing: border-box;}
.title-content h2{font-size: 22px; font-family: 'Roboto', sans-serif; text-transform:uppercase; text-align: left; line-height: 24px;}
.title-content p{font-size: 14px; text-align: left;box-sizing: border-box;}


.article{width: 100%; max-width: 850px; margin: 0 auto 20px; padding: 50px 0 0;}
.cont-article{width: 100%;}
.header-title{width: 100%; padding: 0 0 20px; margin-bottom: 20px!important; color: #333333; background: url(../img/cover01.png) no-repeat center center; background-size: 100%; background-color: #ffffff;border-top: 1px solid #cccccc;border-bottom: 1px solid #cccccc;}
.header-title h1{font-size: 24px; color: #ffffff; font-family: 'Roboto', sans-serif; text-transform:uppercase; line-height: 32px; padding: 10px 0 10px; font-weight: bold;}
.header-title h3{font-size: 16px; color: #ffffff; line-height: 20px; padding: 0px 0 10px; font-weight: normal;}
.cont-article h5{font-size: 18px; text-align: center; line-height: 20px; padding: 0px 0 10px; font-weight: bold;}
.cont-article p{padding: 0 0 20px; text-align: justify; font-size: 16px; line-height: 20px;}
.cont-article ol{padding: 0 0 0 35px;}
.cont-article ol li ol{margin-left: 15px;}
.cont-article ol li{list-style: decimal; font-size: 16px; line-height: 20px; padding: 0 0 20px 0;}
.cont-article ul{padding: 0 0 0 35px;}
.cont-article ul li{list-style: disc; font-size: 16px; line-height: 20px; padding: 0 0 20px 0;}
.cont-article p a{color: #0000ff; text-decoration: underline; font-weight: bold;}
.cont-article .img{width: 100%; text-align: center; padding-bottom: 20px;}
.cont-article .img img{width: 100%; max-width: 800px;}
.cont-article .author{padding: 30px 0;} /*space*/
.cont-article .author img{width: 100%; max-width: 150px; height: auto;}

.img-left{float: left; padding: 0 20px 20px 0;}
.img-right{float: right; padding: 0 20px 0px 20px;}
@media screen and (max-width:360px){
    .img-left,.img-right{float: none!important;display: block!important;text-align: center!important;margin: 0 auto!important;}
}

.silver{width: 100%; height: 1px; margin-bottom: 25px; background-color: #cccccc;}
strong, .bold{font-weight: bold;}
.subr{text-decoration: underline;}
.clear{clear: both;}
em, .italic{font-style: italic;}
.row{margin-top: 15px;}
.center{text-align: center!important;}
.box{width: 95%; background-color: #fbd4b4; border:1px solid #000000; margin: 0 auto 20px; padding: 15px;}
.adbanner{width: 100%; cursor: pointer; height: 150px; border: 1px solid #cccccc; margin: 0px 0 20px; padding: 0px 0 0; max-width: 616px; height: auto;}
.adbanner img{width: 100%; max-width: 800px!important; height: auto;}

@media screen and (max-width: 1024px){
.page_disclaimer2{width: 100%;   position: relative;}
.cont-disclaimer2{width: 90%;  max-width: 980px; margin: 0 auto; padding: 70px 0 40px;}
.cont-disclaimer2 h5{font-size: 18px; font-family: 'Roboto', sans-serif; text-transform:uppercase;  text-align: left; line-height: 20px; padding: 0px 0 10px; font-weight: bold;}
.cont-disclaimer2 p{padding: 0 0 20px; text-align: justify; font-size: 16px; line-height: 20px;}
.cont-disclaimer2 p a{color: #0000ff; text-decoration: underline; font-weight: bold;}
.cont-disclaimer2 ul{padding: 0 0 0 20px;}
.cont-disclaimer2 ul li{list-style: disc; font-size: 16px; line-height: 22px; padding: 0 0 15px 0px;}
.chapter{width: 100%; margin: 0 auto; margin-top: 0px; max-width: 131px; height:74px; background: url(../img/chapterbubble.png) no-repeat; background-size: 131px 74px;}
.chapter h2{font-size: 19px; color: #ffffff; padding: 20px 0 0; letter-spacing: 2px; font-family: 'Roboto', sans-serif; text-transform:uppercase; text-align: center;}
.tableContents{width: 100%; height: 100%;}
.cont-table{width: 100%; max-width: 900px; margin: 0 auto;}
.cont-table h1{text-align: left; font-family: 'Roboto', sans-serif; text-transform:uppercase; font-weight: bold; font-size: 26px; padding: 15px 0 30px; box-sizing: border-box;}
.cont-table ul{padding: 0 0 0 30px;}
.cont-table ul li{list-style: decimal; font-size: 22px; padding: 0 0 0px;}
.cont-table ul li a{text-decoration: none; color: #000000; display:block;}

.title-content{width: 100%; padding: 0 0 20px; box-sizing: border-box;}
.title-content h2{font-size: 22px; font-family: 'Roboto', sans-serif; text-transform:uppercase; text-align: left; line-height: 24px;}
.title-content p{font-size: 14px; text-align: left;box-sizing: border-box;}


.article{width: 100%; max-width: 850px; margin: 0 auto 20px; padding: 50px 0 0;}
.cont-article{width: 100%;}
.header-title{width: 100%; margin-bottom: 20px; padding: 20px 0; color: #fff; background: url(../img/cover01.png) no-repeat; background-size: conver; background-color: #ffffff;}
.header-title h1{font-size: 24px; text-align: center; color: #fff; font-family: 'Roboto', sans-serif; text-transform:uppercase; line-height: 32px; padding: 30px 0 10px; font-weight: bold;}
.header-title h3{font-size: 16px; text-align: center; line-height: 20px; padding: 0px 0 10px; font-weight: normal;}
.cont-article h5{font-size: 18px; text-align: center; line-height: 20px; padding: 0px 0 10px; font-weight: bold;}
.cont-article p{padding: 0 0 20px; text-align: justify; font-size: 16px; line-height: 20px;}
.cont-article ol{padding: 0 0 0 15px;}
.cont-article ol li{list-style: decimal; font-size: 16px; line-height: 20px; padding: 0 0 20px 0;}
.cont-article ul{padding: 0 0 0 15px;}
.cont-article ul li{list-style: disc; font-size: 16px; line-height: 20px; padding: 0 0 20px 0;}
.cont-article p a{color: #0000ff; text-decoration: underline; font-weight: bold;}
.cont-article .img{width: 100%; text-align: center; padding-bottom: 20px;}
.cont-article .img img{width: 100%; max-width: 420px;}
.cont-article .author img{width: 100%; max-width: 150px; height: auto;}

.img-left{float: left; padding: 0 20px 20px 0;}
.silver{width: 100%; height: 1px; margin-bottom: 25px; background-color: #cccccc;}
strong, .bold{font-weight: bold;}
.subr{text-decoration: underline;}
.clear{clear: both;}
em, .italic{font-style: italic;}
.row{margin-top: 15px;}
.center{text-align: center;}
.box{width: 95%; background-color: #fbd4b4; border:1px solid #000000; margin: 0 auto 20px; padding: 15px;}
}

@media screen and (max-width: 650px){
	.cont-pages{width: 100%; margin: 0 auto; width: 100%; padding: 0 0 0;  max-width: 800px;}
.title-page{width: 100%; height: auto; background-color: #ffffff; }
.title-page{width: 100%; position: relative;  }
}


/*
*******************************************************
				Menu
*******************************************************
*/

header{
	background-color:#ffffff;
	position: fixed;
	width: 100%;
}

.logo{
	position: fixed; top: 20px; left: 25px;
}
.logo img{width: 60px; height: auto;}
.logo h1{
	font-size: 40px;
	color: #ffffff;
	padding: 20px 0 0;
 }

 /*
estilos para el menu
 */

.menu_bar{
	display: none;
}

nav.menu{
	display: none;
	float: right;
	width: 82%;
}

nav.menu ul{
	text-align: right;
	list-style: none;
	overflow: hidden;/* limpiar float */ 
}

nav.menu ul li{
	display: inline-block;
}
nav.menu ul li a{
	display: block; /*esto es para poder darle espacio en todos los lados*/ 
	padding: 30px 20px;
	font-size: 13px;
	color: #ffffff;
	text-transform: uppercase;
	text-decoration: none;

}

nav.menu ul li a:hover{
	background-color: #ff0000;
	color: #ffffff;
}

.active{
	background-color: #ff0000;
	color: #ffffff;
}

@media screen and (max-width: 1250px/*1024px*/){

/*
estilos para el header
 */

header{
	background-color:#f2f2f2/* rgba(51,51,51,0.9)*/;
	position: fixed;
	width: 100%;
}

.logo{
	position: fixed;
	right: auto;
	left: 30px;
	margin-right: auto;
	margin-left: auto;
	width: 60%;
	float: none;
	text-align: left;
}
.logo h1{
	font-size: 40px;
	color: #ffffff;
	padding: 20px 0 0;
 }

 /*
estilos para el menu
 */

.menu_bar{
	text-align: right;
	z-index: 9999;
	display:block;
}

.bt-menu {
		display:block;
		padding:15px 20px 20px;
		color:#fff;
		text-decoration:none;
		font-weight: bold;
		font-size:25px;
	}

nav.menu{
	display: block;
	background-color: rgba(51,51,51,0.9);
	position: fixed;
	right: -100%;
	float: none;
	width: 80%;
	height: 100%;
	overflow-y: scroll!important;
}

nav.menu ul{
	text-align: left;
	list-style: none;
	overflow: hidden;/* limpiar float */ 
}

nav.menu ul li{
	display:block;
	padding: 0px 0;
}
nav.menu ul li a{
	display: block; /*esto es para poder darle espacio en todos los lados*/ 
	padding: 10px 10px;
	font-size: 13px;
	color: #ffffff;
	text-transform:uppercase;
	text-decoration: none;

}

nav.menu ul li a:hover{
	background-color: #0000dc;
	color: #ffffff;
}

.active{
	background-color: #ff0000;
	color: #ffffff;
}

.menu_bar span {
		font-size:30px;
	}

}


.top{display:none;
	padding:20px;
	font-size:20px;
	color:#fff;
	cursor:pointer;
	position: fixed;
	bottom:20px;
	right:20px; }
.top i{font-size: 30px; color:rgba(10,47,88,1); }

.blue{color: #00519a;}
.bg-silver{width: 100%; height: 150px; background-color: #e8e8e8;}
.ad-title{width: 100%;   margin-left: -20px; text-align: center; font-family: 'Roboto', sans-serif;}
.ad-title h1{padding: 0; margin: 0; font-size: 28px;}
.ad-title  a.orange-btn{display: block; padding: 12px 20px; margin: 10px auto 0; font-size: 24px; max-width: 220px; border-radius: 10px; background-color: #f39c12; color: #ffffff; text-decoration: none;}


@media screen and (max-width: 640px){
	.bg-silver{width: 100%; height: auto; padding: 20px 0; background-color: #e8e8e8;}
.ad-title{width: 100%;   margin-left: 0px; padding: 15px 0 0; text-align: center; font-family: 'Roboto', sans-serif;}
.ad-title h1{padding: 0; margin: 0; font-size: 28px;}
.ad-title  a.orange-btn{display: block; padding: 12px 20px; margin: 10px auto 0; font-size: 24px; max-width: 220px; border-radius: 10px; background-color: #f39c12; color: #ffffff; text-decoration: none;}
.bg-silver{text-align: center; padding: 20px 0!important;}
.bg-silver img{width: 90px; height: auto;}
}

.bg_ad{ height: 500px;}
.adbanner_big{width: 100%; cursor: pointer; margin: 30px 0; padding: 70px 0 0; height: 500px; background: url(../img/bg_banner.png) no-repeat; background-size: cover;}
.ad-title2{width: 100%;  padding: 20px 0 0;  text-align: left; font-family: 'Roboto', sans-serif;}
.ad-title2 h1{padding: 0; margin: 0; font-size: 28px;}
.ad-title2  a.orange-btn2{display: block; text-align: center; padding: 12px 0px; margin: 10px 0 0; font-size: 34px; max-width: 230px; border-radius: 10px; background-color: #f39c12; color: #ffffff; text-decoration: none;}
.ad-title2  a.orange-btn2:hover{background-color: #d98604;}

.adbanner a{display: block;}
@media screen and (max-width: 650px){
	.bg_ad{ height: auto;}
.adbanner_big{width: 100%; padding: 50px 0; height: auto; background: url(../img/bg_banner.png) no-repeat; background-size: cover;}
.ad-title2{width: 100%;  padding: 20px 0 0;  text-align: left; font-family: 'Roboto', sans-serif;}
.ad-title2 h1{padding: 0; margin: 0; font-size: 28px;}
.ad-title2  a.orange-btn2{display: block; text-align: center; padding: 12px 0px; margin: 10px 0 0; font-size: 34px; max-width: 230px; border-radius: 10px; background-color: #f39c12; color: #ffffff; text-decoration: none;}
.ad-title2  a.orange-btn2:hover{background-color: #d98604;}


}

/********************************

    ads styles

*******************************/
.cont-ads{width: 100%;background: #ffffff;text-align: center;margin: 20px auto 40px;border-top:3px solid #2d2d2d;border-bottom:3px solid #2d2d2d;}
.cont-ads .image-ads img{width: 100%;max-width: 500px;height: auto;padding: 10px 0 20px}
.cont-ads .image-ads-netpicks img{width: 100%;max-width: 200px;height: auto;padding: 10px 0 20px}
.text-ads{text-align: left;}
.text-ads h1{font-size: 24px;line-height: 30px;font-weight: bold;text-align: center;padding-bottom: 20px;}
.text-ads p{font-size: 18px;line-height: 26px;text-align: left;padding-bottom: 20px!important;}
.text-ads a{display: inline-block;font-size: 20px;font-weight: bold; line-height: 26px;text-align: left;padding-bottom: 20px;}
.text-ads a:hover{text-decoration: underline;}

.ads-wrapper{width: 100%;max-width: 750px;margin: auto;background: #ffffff;padding: 10px 20px!important;box-sizing: border-box;}
.ads-clear{clear: both;}
.ads-wrapper .bold{font-weight: bold;font-size: 21px;}

.ads-header{background: #000;}
.ads-header .ads-title{text-align: center;}
.ads-header .ads-title img{padding: 30px 0;text-align: center;}
.ads-red{height: 5px; background: #d00b00;}
.ads-main{text-align: center;font-size: 40px;font-weight: bold;}
.ads-main .ads-title{text-align: center;padding: 10px 0 20px;}
.ads-main .ads-title img{width: 400px;}
.ads-main .ads-left{float: left; width: 50%;text-align: center;color: #bf6211;display: inline-block;margin: auto;font-size: 20px;line-height: 28px;font-family: 'Open Sans', sans-serif;padding: 50px 0 0;}
.ads-main .ads-left img{width: 90%;max-width: 192px;}
.ads-main .ads-right{width: 50%;display: inline-block;margin: auto;float: left;padding: 110px 0 0;}
.ads-main .ads-right img{width: 90%;max-width: 192px;padding: 5px 0;margin-left: -80px; }
.ads-main .ads-right p{font-family: 'Open Sans', sans-serif;font-size: 16px;line-height: 30px;}
.ads-btn-cont{text-align: center;width: 100%;padding: 10px 0 30px;}
.ads-btn{
    margin:20px;width: 70%;cursor: pointer;
border:3px solid #a2c5eb;border-radius: 20px;font-size:45px;font-family: 'Open Sans', sans-serif; padding: 25px 15px 25px 15px; text-decoration:none; display:inline-block;text-shadow: 0px 0px 0 rgba(0,0,0,0.3);font-weight:bold; color: #FFFFFF;
 background-color: #e87814; background-image: -webkit-gradient(linear, left top, left bottom, from(#e87814), to(#e87814));
 background-image: -webkit-linear-gradient(top, #e87814, #e87814);
 background-image: linear-gradient(to bottom, #e87814, #e87814);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#e87814, endColorstr=#e87814);
}

.ads-btn:hover{
 border:3px solid #a2c5eb;
 background-color: #bd5d08; background-image: -webkit-gradient(linear, left top, left bottom, from(#bd5d08), to(#bd5d08));
 background-image: -webkit-linear-gradient(top, #bd5d08, #bd5d08);
 background-image: linear-gradient(to bottom, #bd5d08, #bd5d08);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#bd5d08, endColorstr=#bd5d08);
}

@media screen and (max-width:540px){
    .ads-main{font-size: 29px!important;}
    .ads-main .ads-left,.ads-main .ads-right{width: 100%;display: block;}
    .ads-main .ads-right img{width: 90%;max-width: 192px;padding: 5px 0;margin: 0px auto;display: block;}
    .ads-main .ads-right{padding: 10px 0 0;}
    .ads-btn{font-size: 30px;}
}

/********************************

    btns styles

*******************************/
.offert{text-align: center;width: 90%;margin: 0 auto;text-align: center!important;}
.offert-btn{margin: 0 auto!important;
border:2px solid #0906b2; box-shadow: #B4B5B5 2px 2px 2px  ;border-radius: 3px;font-size:18px; padding: 20px 20px; text-decoration:none!important; display:inline-block;text-shadow: -1px -1px 0 rgba(0,0,0,0.3);font-weight:bold; color: #FFFFFF!important;
 background-color: #2B2BF0; background-image: -webkit-gradient(linear, left top, left bottom, from(#2B2BF0), to(#2C10E3));
 background-image: -webkit-linear-gradient(top, #2B2BF0, #2C10E3);
 background-image: linear-gradient(to bottom, #2B2BF0, #2C10E3);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#2B2BF0, endColorstr=#2C10E3);
}

.offert-btn:hover{
 border:2px solid #0906b2;
 background-color: #0f0fd9; background-image: -webkit-gradient(linear, left top, left bottom, from(#0f0fd9), to(#230db3));
 background-image: -webkit-linear-gradient(top, #0f0fd9, #230db3);
 background-image: linear-gradient(to bottom, #0f0fd9, #230db3);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#0f0fd9, endColorstr=#230db3);
}

hr{margin-bottom: 20px;}

.offert-list{padding-bottom:160px!important;margin-top:20px!important;}
@media screen and (max-width:800px){
    .offert-list{padding-bottom:120px!important;margin-top:20px!important;}
}
@media screen and (max-width:600px){
    .offert-list{padding-bottom:20px!important;margin-top:20px!important;display: block!important;}
    .align-offert-mobile{width: 100%; text-align: center; padding-bottom: 20px;}
    .align-offert-mobile img{width: 100%; max-width: 650px;}
}

/********************************

    video styles

*******************************/
.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; height: auto;margin-bottom: 15px; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.border-img{border:1px solid #4d4d4d;}
.red-center{color: #ff0000!important;font-weight: bold!important;text-align: center!important;}
.spot{padding: 20px 0;text-align: center;width: 600px;background: #fdfdfd;text-align: center;border:1px solid #000;margin:0 auto  20px;}
.spot h1{padding: 0px;text-align: center!important;width: 100%;font-size: 40px!important;display: block;font-weight: bold;color: #0000dc;}
.spot a{display: block;padding: 20px 0;text-align: center;width: 100%;}
.spot h4{padding: 0px;text-align: center!important;width: 100%;font-size: 16px!important;display: block;}

.cont-article .img-2{width: 100%; text-align: center; padding-bottom: 20px;display: inline-block;text-align: center;}
.cont-article .img-2 img{width: 100%; max-width: 450px;}

.offer{padding: 15px;box-sizing: border-box;margin: 0 auto;text-align: center;}
.offer a{max-width: 850px; font-size: 18px;color: #fff;text-decoration: none;display: inline-block;padding: 15px 30px!important;font-weight: bold;text-transform: uppercase;margin: 0 auto;
    
border:3px solid #df0909;border-radius: 3px;text-shadow: 0px 0px 0 rgba(0,0,0,0.3);
 background-color: #f62b2b; background-image: -webkit-gradient(linear, left top, left bottom, from(#f62b2b), to(#d20202));
 background-image: -webkit-linear-gradient(top, #f62b2b, #d20202);
 background-image: linear-gradient(to bottom, #f62b2b, #d20202);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#f62b2b, endColorstr=#d20202);
}
.offer a:hover{border:3px solid #b30808;
 background-color: #e40a0a; background-image: -webkit-gradient(linear, left top, left bottom, from(#e40a0a), to(#9f0202));
 background-image: -webkit-linear-gradient(top, #e40a0a, #9f0202);
 background-image: linear-gradient(to bottom, #e40a0a, #9f0202);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#e40a0a, endColorstr=#9f0202);}


@media screen and (max-width:1200px){
    .header-title h1,.header-title h3{box-sizing: border-box;padding-left: 15px;padding-right: 15px;}
}

.border-gray{padding: 15px 0!important;text-align: center!important;background: #cccccc!important;display: block!important;margin-bottom: 15px!important;}

@media screen and (max-width:991px){
    .right-img-cp1{padding-top: 20px;}
}


.video {
    height: auto;
    position: relative;
    max-width: 100%;
    padding-bottom: 20px;
}
video {  
    cursor: pointer;
    width:100%; 
    max-width:900px; 
    height:auto; 
}