html, body { color: #666666; font-size: 14px; font-family: Verdana, Arial, Helvetica, sans-serif; line-height: 1.6em; word-wrap: break-word; text-align: left; background-color: #FFFFFF; margin: 0; padding: 0 }

* { box-sizing: border-box; }

section { clear: both; padding: 1rem 0 }
section.bg-grey { margin: 1rem 0; padding: 2rem 0 }
section::after { content: ""; clear: both;  }

h1, h2, h3, h4, h5 { clear: both; font-size: 2.5rem; font-family: inherit; font-weight: bold; color: #CC6600; line-height: initial; margin-top: 0 }
h2, h3, h4, h5 { font-size: 1.5rem; }
h3, .h3, h4, h5 { color: #666666; font-size: 1.1rem; }

img { border: 0; max-width: 100%; height: auto }

p { clear: both; margin: 0 0 1rem }

a { text-decoration: none; color: #346AA0; }
a:hover { color: #CC6600 }

ul, ol { margin: 0; padding: 0; border: none; list-style: inside }
li { position: relative; padding: 0; text-align: left; list-style-type: none; display: inline-block; padding: 0 0.5rem 0.2rem; }

nav { z-index: 100 }

header { position: relative; padding: 0.5rem 0 0; font-size: 1.0rem; font-family: inherit; color: #346AA0; line-height: initial  }
header a:hover { color: #346AA0 }

label { clear: both; float: left; }

select, input, textarea, a.btn	{ background-color: #FFFFFF; border-radius: 3px; text-align: left; border: 1px #336699 solid; color: #346AA0; padding: 1%; margin-bottom: 2%; font-size: inherit; font-family: Verdana, Arial, Helvetica; width: 100% }
input[type=text] {  }
input[type=checkbox] { width: auto; } 
input[type=radio] { width: auto; } 
input[type=submit], button[type=submit], a.btn { margin: 1.0rem 0; padding: 0.6rem 2.5rem; cursor: pointer; width: auto; color: #346AA0; border: 2px #FF9900 solid }
input[type=submit]:hover {  }
textarea { resize: none }

button { cursor: pointer; border: 1px solid #FFFFFF; background-color: transparent; }

footer { clear: both; padding: 0.4rem; background-color: #346AA0; font-size: 0.9rem;  }
footer ul { margin: 0 auto; padding: 0; position: relative; }
footer li { display: inline-block; list-style: none; padding: 0 0.5rem }
footer a, footer a:hover { color: #FFFFFF }
footer a:hover { color: #FF9900 }

.wrapper{ max-width: 1150px; clear: both; margin: 0 auto; padding: 0 0.5rem; text-align: left; }
.wrapper::after { content: ""; clear: both;  }

.container { position: relative; }
.logo{ max-width: 75px }
.logo_domain { margin: 0; position: absolute; top: 45%; -ms-transform: translateY(-45%); transform: translateY(-45%); font-size: 1.5rem; font-weight: bold }
.logo_claim	{ font-size: 0.9rem }

.row { text-align: left; display: flex; width: 100%; margin-bottom: 1rem; column-gap: 0.5rem; flex-wrap : wrap }
.row::after { content: ""; clear: both;  }
.table_cell { display: table-cell; }

[class*="col-"] { float: left; padding: 0.8rem; margin-bottom: 0.8rem }
.col-onesixth		{width: 16.66%;}
.col-onequarter		{width: 25%;}
.col-onethird		{width: 33.33%;}
.col-twoquarters	{width: 50%;}
.col-twothirds		{width: 66.66%;}
.col-threequarters	{width: 75%;}
.col-fivesixth		{width: 83.33%;}
.col-full			{width: 100%;}

.bg-grey { background-color: #f4f5f5 }
.bg-white { background-color: #ffffff }

.center { text-align: center }
.right	{ text-align: right }
.left { text-align: left }
.justify { text-align: justify }
.f_left { float: left }
.f_right { float: right }

.height_s { height: 100px }
.height_m { height: 200px }
.height_l { height: 300px }
.height_xl { height: 400px }

.tf999	{ display: none }

.border_shadow { border: 1px solid #f9f9f9; box-shadow: 0 4px 12px -2px rgba(0,0,0,0.14); -webkit-box-shadow: 0 4px 12px -2px rgba(0,0,0,0.14); -moz-box-shadow: 0 4px 12px -2px rgba(0,0,0,0.14); -ms-box-shadow: 0 4px 12px -2px rgba(0,0,0,0.14); -o-box-shadow: 0 4px 12px -2px rgba(0,0,0,0.14); }

.border_notice { border: 1px #FF9900 solid; }

.txtongfx_bottom { position: absolute; bottom: 0; background: rgb(255, 255, 255); background: rgba(255, 255, 255, 0.7); width: 100%; padding: 0.2rem 0 0.6rem; font-size: 1.3rem; font-family: inherit; font-weight: bold; color: #666666; }

.clear { clear: both; display: block; margin: 0; padding: 0; font-size: 1px }
.clearfix:after{   content: " "; clear: both; display: block; height: 0px; }

@media only screen and (min-width : 1024px) { 
	html, body { font-size: 16px; }	
	h2.add_on_domains { text-align: left }
	.column { width: 100%; column-count: 2; column-gap: 3rem; hyphens: auto; column-rule-style:dotted; column-rule-width:1px; column-rule-color:silver; }
	.row { flex-wrap : nowrap	}
	
}

@media only screen and (min-width : 768px) and (max-width : 1023px) {
	.logo{ max-width: 65px }	
	h2.add_on_domains { text-align: left }
	.column { width: 100%; column-count: 2; column-gap: 3rem; hyphens: auto; column-rule-style:dotted; column-rule-width:1px; column-rule-color:silver; }
	.row { flex-wrap : nowrap	}	
}

@media only screen and (min-width : 579px) and (max-width : 767px) {
	.logo{ max-width: 65px }	
	.column { width: 100%; column-count: 2; column-gap: 3rem; hyphens: auto }
	[class*="col-"] { width: 100%; }
}

@media only screen and (min-width : 446px) and (max-width : 578px) {
	.logo{ max-width: 55px }
	.logo_domain { top: 40%; -ms-transform: translateY(-40%); transform: translateY(-40%); font-size: 1.3rem;  }
	 [class*="col-"] { width: 100%; }
}

@media only screen and (max-width : 445px) {	
	.logo{ max-width: 50px }	
	.logo_domain { top: 40%; -ms-transform: translateY(-40%); transform: translateY(-40%); font-size: 1.3rem; }
	 [class*="col-"] { width: 100%; }
}