@media screen and (max-width: 1400px) {
    #content-full {
		padding: 0 40px !important;
	}
	
	.section-3 .box .box-header .pattern {
		right: 40px;
	}
	
	.section-3 .box .box-header img {
		right: 0;
	}
}

@media screen and (max-width: 1267px) {
    .section-3 .box {
		padding: 25px;
	}
	
	.section-3 .box .box-header img {
		width: 610px;
		right: 50px;
	}
}

@media screen and (max-width: 1200px) {
    .content-col-main2,
	.content-col-side2 {
		float: none !important;
		width: 100% !important;
		padding: 0 !important;
	}
	
	.section-3 .box .box-header .pattern {
		right: 40px;
	}
	
	.section-3 .box .box-header img {
		right: -20px;
	}
	
	.header .mac {
		position: relative;
		width: 500px;
	}
	
	.header .pattern {
		display: none;
	}
	
	.header .content-col-side2 p {
		text-align: center;
	}
	
	.section-1 {
		margin-top: 120px;
	}
	
	.section-3 .tables {
		display: block;
		text-align: center;
	}
	
	.section-3 .table-1 {
		margin-top: 40px !important;
	}
	
	.section-3 .table-2 {
		margin-top: 60px;
	}
	
	#fases {
		margin-top: 60px;
	}
	
	.example-content {
		margin-top: 206px;
	}

	.go-to {
		float: none;
	}
	
	#bt-simulation {
		right: -95px;
		padding: 12px 22px;
		font-size: 13px;
	}
	
	#bt-simulation img {
		width: 24px;
	}
}

@media screen and (max-width: 1195px) {
	.example-content {
		position: fixed;
		z-index: 3;
		top: -95px;
		border: 1px solid #dfdfdf;
	}
	
	.example-1 {
		left: calc(50% - 352px);
	}
	
	.example-2 {
		left: calc(50% - 429px);
	}
}

@media screen and (max-width: 900px) {
	.section-3 .box .box-header img {
		width: 480px;
	}
	
	.example-content {
	    left: 20px;
		width: auto;
		right: 20px;
	}
	
	.section-6 h1 {
		font-size: 24px !important;
		line-height: 27px !important;
	}
	
	#bt-simulation {
		right: -87px;
		padding: 9px 22px;
		font-size: 13px;
	}
}

@media screen and (max-width: 795px) {
	.section-2 .top-title {
		display: block;
	}
	
	.section-2 table td {
		display: block;
	}
	
	.section-2 table td:first-of-type {
		display: none;
	}
	
	.section-5 .form {
		padding: 0 20px;
	}
	
	.section-7 .flex-tabs .flex-tab {
		margin-right: 50px;
	}
	
	.section-7 .flex-tabs .flex-tab h2 {
		font-size: 20px !important;
	}
}

@media screen and (max-width: 700px) {
    .section-1 table td {
		font-size: 15px;
		line-height: 18px;
		padding-left: 70px;
		display: block;
	}

	.section-1 table td:first-of-type {
		padding-right: 60px;
	}

	.section-1 table tr:nth-child(1) td {
		padding-bottom: 40px;
	}

	.section-1 table tr:nth-child(1) td:nth-child(1) {
		background-size: 50px;
		background-position-y: 12px;
	}

	.section-1 table tr:nth-child(1) td:nth-child(2) {
		background-size: 41px;
		background-position: 12px 2px;
	}

	.section-1 table tr:nth-child(2) td:nth-child(1) {
		background-size: 30px;
		background-position: 16px 5px;
	}

	.section-1 table tr:nth-child(2) td:nth-child(2) {
		background-size: 39px;
		background-position: 13px 3px;
	}
	
	.section-3 .box .box-header p:first-of-type {
		position: relative;
	}
	
	.section-3 .box .box-header img,
	.section-3 .box .box-header .pattern,
	.section-6 .content-col-main2 {
		display: none;
	}
	
	/* .section-3 .box .box-header .pattern { */
		/* display: inline-block; */
		/* margin-top: -280px; */
	/* } */ 
	
	.section-3 .tables {
		margin-top: 0;
	}
	
	.section-3 .table-1,
	.section-3 .table-2	{
		/*display: none;*/
		margin: 0 auto 40px !important;
		width: 100% !important;
		max-width: 438px !important;
	}
	
	.section-3 .svg-table-1,
	.section-3 .svg-table-2	{
		/*display: block;*/
		display: none;
	}







	/*.section-3 .table-1 tbody,
	.section-3 .table-1 tfoot
	{
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		flex-direction: column;
		width: 100%;
	}
	.section-3 .table-1 thead
	{
		border: none;
		clip: rect(0 0 0 0);
		height: 1px;
		margin: -1px;
		overflow: hidden;
		padding: 0;
		position: absolute;
		width: 1px;
	}
	.section-3 .table-1 tr
	{
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		flex-direction: column;
		width: 100%;
	}
	.section-3 .table-1 td
	{
		text-align: right;
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		flex-direction: column;
		width: calc(100% - 20px);
		padding: 5px 10px !important;
		font-size: 14px !important;
	}
	.section-3 .table-1 td::before
	{
		!*
        * aria-label has no advantage, it won't be read inside a table
        content: attr(aria-label);
        *!
		content: attr(data-label);
		float: left;
		font-weight: bold;
		text-transform: uppercase;
		margin-bottom: 6px;
	}
	.section-3 .table-1 td:last-child {
		border-bottom: 0;
	}
	.section-3 .table-1 p:empty {
		display: none;
	}*/
	.section-3 .table-2,
	.section-3 .table-1 {
		width: 100%;
		max-width: 100%;
		overflow-x: auto;
		padding-bottom: 20px;
	}
	.section-3 .table-2 td[colspan="2"],
	.section-3 .table-1 td[colspan="2"] {
		min-width: 6px;
	}
	.section-3 .table-2 td,
	.section-3 .table-1 td {
		position: relative;
	}
	.section-3 .table-2 tbody td:not([colspan]),
	.section-3 .table-2 tfoot td:not([colspan]),
	.section-3 .table-1 tbody td:not([colspan]),
	.section-3 .table-1 tfoot td:not([colspan]) {
		padding: 20px !important;
		white-space: nowrap;
	}
	.section-3 .tables {
		text-align: left;
	}












	.section-3 {
		width: 100vw;
		margin-left: -40px;
	}

	.section-5 .inner-section {
		padding: 0 !important;
	}
}

@media screen and (max-width: 460px) {
	.section-3 .table-2 tbody td:not([colspan]),
	.section-3 .table-2 tfoot td:not([colspan]) {
		padding: 10px 20px !important;
		font-size: 14px !important;
		vertical-align: middle;
	}
	.section-3 .table-2 tr td img {
		max-width: 78% !important;
	}
}