@charset "utf-8";
/* CSS Document */

	.size-chart th {
		white-space: normal;
		text-align: center;
		font-family: Arial;
		font-size: 0.7em;
		line-height: 1em;
		font-weight: bold;
		color: #ffffff;
		background: #05173d;
		padding: 5px;		
		border-bottom: 1px solid #cacbcd;
		border-right: 1px solid #cacbcd;
	}
	
	.size-chart td {
		text-align: center;
		font-family: Arial;
		font-size: 1em;
		line-height: 2em;
		color: #05173d;
		border-bottom: 1px solid #cacbcd;
		border-right: 1px solid #cacbcd;
	}
	
	.size-chart-2 th {
		width: 50%; /* 2 columns */	
	}
	
	.size-chart-3 th {
		width: 33.333%; /* 3 columns */	
	}
	
	.size-chart-4 th {
		width: 25%; /* 4 columns */	
	}
	
	.size-chart-5 th {
		width: 20%; /* 5 columns */	
	}
	
	.size-chart-6 th {
		width: 16.666%; /* 6 columns */	
	}
	
	.borderleft {
		border-left: 1px solid #cacbcd;	
	}
	
	.colcolor {
		background-color: #dcdff0;
	}
	
	#size-chart-content p {
		margin-top: 15px;
		margin-bottom: 15px;	
	}
	
	#size-chart-content h4 {
		margin-bottom: -15px;	
	}
	
	#size-chart-content strong {
		font-weight: bold;	
	}
	
	#size-chart-subcontent {
		width: 100%;
		float: left;
	}
	
	#size-chart-subcontent p{
		width: 50%;
		float: left;
	}
	
	.tel {
		font-size: 1em;	
	}
	
	h2 {
		font-size: 1.2em;
	}
	
	.size-icon {
		max-width: 85%;
		margin-left: 10px;
	}
	
@media screen and (min-width: 480px) {
	
	.size-chart th {
		font-size: 0.8em;
		line-height: 1em;
	}
	
	h2 {
		font-size: 1.4em;	
	}
	
	.size-icon {
		max-width: 100%;
	}

@media screen and (min-width: 768px) {
	
	.size-chart th {
		font-size: 1em;
		line-height: 1em;
	}
	
	.tel {
		text-decoration: none; /* still clickable but visually not a phone link on large devices */
	}
	
}