body { margin: 0px; } 
	    .content div,p,li,td { font-family: arial; font-size: 12px; }
	    li { margin: 4px; }
		table { width: 80%; border-collapse: collapse; margin-bottom: 20px;}
	    table, th, td { border: 1px solid #20232D; }
	    td { padding: 4px; padding-left: 8px; vertical-align: top; }
		p { color: #222222; font-family: Arial, Helvetica, sans-serif !important; font-size: 12px; text-align: justify; clear:both; }
	   	.head_1 { width: 100%; height: 60px; background-color: #20232D;  margin-bottom: 10px; }
		.content { margin-left: 5%; margin-right: 5%; }
		.headlogo { padding-top: 18px; margin-left: 5%; margin-right: 5%; }
		.title { color: #20232D; font-family: Arial, Helvetica, sans-serif; font-size: 18px !important; }
		.subtitle { color: #222222; font-family: Arial, Helvetica, sans-serif !important; font-size: 16px !important; padding-top: 8px; }
		.subsubtitle { color: #222222; font-family: Arial, Helvetica, sans-serif !important; font-size: 14px; padding-top: 8px; }
	    .preferencias { font-family: arial; font-size: 12px; height: 40px !important; background-color: #20232D; border: none; color: #ffffff; padding: 15px 32px; text-align: center; text-decoration: none; display: inline-block; }		
		.table_info { }
		.table_title { color: #20232D; font-family: Arial, Helvetica, sans-serif; font-size: 16px; padding: 0px !important; padding-bottom: 8px; }
		.table_subtitle { background-color: #20232D; color: #ffffff; font-family: Arial, Helvetica, sans-serif; font-size: 14px; }
		.textl { font-family: arial; font-size: 10px; }
		.centered { text-align: center; }
		
		@media 
		only screen and (max-width: 760px),
		(min-device-width: 768px) and (max-device-width: 1024px)  {
		
			/* Force table to not be like tables anymore */
			table, thead, tbody, th, td, tr { 
				display: block;
			}
			
			/* Hide table headers (but not display: none;, for accessibility) */
			thead tr { 
				position: absolute;
				top: -9999px;
				left: -9999px;
				padding: 0px;
			}
			
			table { border: 1px solid #20232D; border-bottom: 0px; width: 100% !important; }
			tr { border-bottom: 1px solid #20232D; }
			td { 
				/* Behave  like a "row" */
				border: none;

				position: relative;
				padding-left: 50%; 		
				text-align: left !important; 				
			}
			
			td:before { 
				/* Now like a table header */
				position: absolute;
				/* Top/left values mimic padding */
				top: 6px;
				left: 6px;
				width: 45%; 
				padding-right: 10px; 
				white-space: wrap;
				text-align: left; 
				font-weight: bold;			
			}
			
			/*
			Label the data
			*/
			td.td1:nth-of-type(1):before { content: "Nombre:"; }
			td.td1:nth-of-type(2):before { content: "Descripción:"; }
			td.td1:nth-of-type(3):before { content: "Duración:"; }
			td.td1:nth-of-type(4):before { content: "Tipo:"; }
			td.td2:nth-of-type(1):before { content: "Proveedor:"; }
			td.td2:nth-of-type(2):before { content: "Descripción:"; }
			td.td2:nth-of-type(3):before { content: "Tipo:"; }
			td.td2:nth-of-type(4):before { content: "Más Información:"; }
			td.td3:nth-of-type(1):before { content: "Nombre:"; }
			td.td3:nth-of-type(2):before { content: "Descripción:"; }
			td.td3:nth-of-type(3):before { content: "Dominio:"; }
			td.td3:nth-of-type(4):before { content: "Duración:"; }			
			td.td3:nth-of-type(5):before { content: "Tipo:"; }
			td.td3:nth-of-type(6):before { content: "Propietario"; }

			
		}