/* Main styling for petroseikon.com */

/* Layout */
/* note: all selectors ending with front are for the front page */

body {
	margin: 0;
	padding: 0;
	font: small/1.3em "Century Gothic", sans-serif;
	text-align: left;
}

#container {
	width: 1024px;
	margin: 10px auto;
}

#banner {
	display: flex;
}

#banner_right {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

#banner_search {
	align-self: end;
}

.home #content {
	background: #fff;
}

#content {
	background: #fff;
	position: relative;
	width: 1024px;
	margin: 0 auto;
}

/* Left column */
#side {
	width: 231px;
	float: left;
	position: relative;
	font: 1.0em "Century Gothic", sans-serif;
}

/* Padded content container */
#side .container {
	padding: 5px 5px;
}

/* No margin at the bottom for "(more)" links */
#side .container p {
	margin: 0;
}

/* Main column */
#main {
	width: 793px;
	float: right;
	color: black;
	font: 1.0em "Century Gothic", sans-serif;
}
#main ul {
	list-style-position:outside;
	padding-left: 1em;
	margin-left: 0.5em;
}
#main li {
	padding-left: 0.5em;
}
/* Padded content container */
#main .container {
	padding: 5px 20px;
}

#main .container p {
	margin: 0.5em 0;
}

/* Main Header */
#header {
	width: 100%;
	height: 133px;
	background: #fff url("/images/header/home_header.png") no-repeat;
}

/* Logo */
#logo {
	float: left;
	width: 186px;
	height: 50px;
	margin: 21px 0 0 30px;
	padding: 0;
	border-width: 0;
	text-decoration: none;
	/* Without this, IE will double margin-left size o.O
	http://www.positioniseverything.net/explorer/doubled-margin.html */
	display: inline;
}

#logo img {
	/* text-indent: none; */
	z-index: 10;
}

#logo img a {
	text-decoration: none;
}

.home #logo {
	margin: 24px 0 0 28px;
}


/* Footer */
#footer {
	clear:left;
	text-align: center;
	color: #000;
}

#footer p {
	font: x-small/1.3em Helvetica, Verdana, sans-serif;
	color: #000;
	margin: 0;
	padding: 5px;
	text-align: center;
}

/* Left-column items */
#search, #ml {
	color: black;
	margin: 0 0 10px 0px;
	padding-bottom: 5px;
}

#news {
	border-bottom: 1px #ccc dotted;
}

/* Links */
a:link {
	text-decoration: none;
	border-bottom: 1px black dotted;
	color: black;
	font-weight: bold;
}

a:visited {
	text-decoration: none;
	border-bottom: 1px black dotted;
	color: black;
	font-weight: normal;
}

a:hover {
	text-decoration: none;
	border-bottom: 1px black solid;
	color: black;
}

a:active {
	text-decoration: none;
	border-bottom: 1px black dotted;
	color: black;
}

a.plain:link, a.plain:visited, a.plain:hover, a.plain:active {
	text-decoration: none;
	border: none;
	font-weight: normal;
	color: inherit;
}

a.white:link, a.white:visited, a.white:hover, a.white:active {
	text-decoration: none;
	border: none;
	color: white;
}

a.blue:link, a.blue:visited, a.blue:active {
	border-bottom: 1px #009 dotted;
	color: #009; 
}

a.blue:hover {
	border-bottom: 1px #009 solid;
	color: #009;
}

#side a, .ltnotice a, .notice a, .linenotice a,
.tab a, .links a, .errorpage a, .smltab a, .dkbox a{
	color: black;
	border-bottom: 1px black dotted;
	font-weight: bold;
}
#side .up a {
	color: #364f64;
	border-bottom: 1px #364f64 dotted;
	font-weight: bold:
}

#side .up a:hover {
	color: #364f64;
	border-bottom: 1px #364f64 solid;
	font-weight: bold:
}

h3 a:link {
	color: #364f64;
	border-bottom: 1px #364f64 dotted;
	font-weight: bold;
}
.
#side a:visited, .ltnotice a:visited, .notice a:visited, 
.linenotice a:visited, .tab a:visited, .links a:visited, .errorpage a:visited, .smltab a, .dkbox a{
	color: black;
	border-bottom: 1px black dotted;
	font-weight: normal;
}

h3 a:hover{
	color: #364f64;
	border-bottom: 1px #364f64 solid;
	font-weight: bold;
	
}

#side a:hover, .ltnotice a:hover, .notice a:hover, 
.linenotice a:hover, .tab a:hover, .links a:hover, .errorpage a:hover, .smltab a, .dkbox a{
	color: black;
	border-bottom: 1px black solid;
}

/* Headings */
h1 {
	background: #000;
	font-size: 1.7em;
	text-align: center;
	color: white;
	padding: 30px 0;
	line-height: 1.7em;
	margin: 0;
}

.home h1{
	font-size:3.5em;
	line-height: 1.7em;
}

h2 {
	top: -3em;
	font-size: 1.3em;
	font-weight:normal;
	text-align: center;
	position: relative;
	color: white;
}

.home h2 {
	font-size:1.7em;
	font-weight: bold;
	text-align: left;
	top:0;
}

h3 {
	font-size: 1.4em;
	text-align: left;
	clear: left;
	position: relative;
	color:#364f64;
}

h3#software a{
	color: #007cc3;
	border-bottom: 1px #007cc3 dotted;
	font-weight: bold;
}

h3#software a:hover{
	color: #007cc3;
	border-bottom: 1px #007cc3 solid;
	font-weight: bold;
}

h5 {
	font-size: 1.2em;
	margin: 5px 0px;
	padding: 0.1em;
	text-align: left;
	line-height: 1.2em;
	clear: left;
	position: relative;
}

.headerfront {
	color: #fff;
	font-family: Arial Black;
	height: 39px;
	width: 670px;
	line-height: 1em;
	padding-top: 8px;
	padding-left: 0px;
	background: url('/images/bg/rkheader.png') no-repeat center center;
	font-size: 1.8em; text-align: center;
	margin-left: 150px;
	margin-top: 0px;
}

.subheading {
	text-align: center;
	margin: -2.5em 0 1.5em;
	font-size: 1.3em;
	color: white;
}

.subheading a{
	color: white;
	border-bottom-color: white;
}

/* Round Corner box */
.thinbox {
	padding-bottom: 20px;
	width: 213px;
	background: url("/images/bg/monobottom.png") no-repeat left bottom;
}

.thintop {
	padding: 20px 10px 0px 20px;
	background: url("/images/bg/monotop.png") no-repeat left top;
}

.thinbox2 {
	width:249px;
	height:335px;
	color: black;
	border: 4px solid black;
	border-radius: 7px;
	margin-top: 10px;
}

.thinbox2 p {
	margin:13px 13px 0px;
}

.thinbox2 a.infoheader {
	font-weight:bold;
	color:#364f64;
	font-size:17px;
}

.monobox2 {
	width:200px;
	height:335px;
	background: #fff url("/images/bg/monobox2.png") no-repeat left bottom;
	color: black;
	float: left;
	display:inline;
}

.monobox2 p {
	margin:13px 13px 0px;
}

.monobox2 a.infoheader {
	font-weight:bold;
	color:#364f64;
	font-size:17px;
}
.monobox3 {
	width:298px;
	height:335px;
	color: black;
	border: 4px solid black;
	border-radius: 7px;
	margin-top: 10px;
}

.monobox3 p {
	margin:13px 13px 0px;
}

.monobox3 a.infoheader {
	font-weight:bold;
	color:#364f64;
	font-size:17px;
}
.newsbox p {
	margin:13px 13px 0px;
}

.newsbox a.infoheader {
	font-weight:bold;
	color:#364f64;
	font-size:17px;
}

.newsbox {
	width:412px;
	height:380px;
	color: black;
	border: 4px solid black;
	border-radius: 7px;
	margin-top: 10px;
}

.widebox{
	margin-left:30px;
	padding-left:20px;
	padding-top:10px;
	width: 446px;
	height: 220px; 
	margin-top: -100px;
	background: url("/images/bg/widebox.png") no-repeat;
	font: 85%/1.3em Verdana, sans-serif;
}

.widebox a {
	border-bottom: 1px dotted white;
	color: white;
}

.roundbox {
	background: #000;
	color: white;
	display: grid;
	padding-bottom: 20px;
	grid-template-columns: 1fr 1fr;
	gap: 50px;
}

.roundbox ul, .roundbox2 ul {
	list-style-position:inside;
	margin-top:30px;
	font-weight:normal;
	font-size:1.1em;
}

.roundbox ul {
	font-weight:bold;
}

.roundbox a, .roundbox2 a {
	color: white;
	border-bottom: dotted 1px white;
}

.roundbox a:visited{
	font-weight:bold;
}

.roundbox picture{
	justify-self: right;
}
.roundbox2 {
	background: #000;
	color: white;
	position:relative;
	font-weight:bold;
	height:200px;
	width:512px;
	float:left;
	padding-top:20px;
	margin-top:-20px;
}

.roundbox2 ul {
	font-weight:normal;
	font-size:1em;
}
.roundbox2 img {
	float:left;
	margin:0 30px;
}

a.slideheader2{
	font-size:1.2em;
}

.boxbottom {
	width: 249px;
	background: #829bb0 url("/images/bg/bottomtab.png") no-repeat left bottom;
	color: black;
	position:relative;
	margin-bottom: 10px;
	margin-left: 10px;
	font: 85%/1.3em Verdana, sans-serif;
}

.boxtop {
	background: url("/images/bg/toptab.png") no-repeat left top;
}

.boxbottom .main {
	text-align: left;
	padding: 80px 20px 20px 10px;
}

.boxbottom a img {
	padding-top: 15px;
	position:absolute;
}

.boxbottom li {
	background: url("/images/lists/bullet-dark.png") no-repeat left 4px;
	text-indent: 10px;
}

.dkbox2 {
	background: url("/images/bg/dkbox2.png") no-repeat bottom;
	color: white;
	width: 464px;
	height: 62px;
	text-align: center;
	color: white;
	position:absolute;
	top: 360px;
	left: 530px;
	font-size:14px
}

.dkbox {
	border:1px black solid;
	color: white;
	width: 370px;
	text-align: center;
	color: black;
	margin: 1em auto;
}

/* Two-column box */
.box2 {
	float: left;
	width: 100%;
	background: transparent url("/images/bg/2box-bg-1.png") repeat-y;
	background-position: center center;
	margin-bottom: 1.5em;
}

.box2 .left2 {
	float: left;
	width: 350px;
	margin: 0;
	position: relative;
}

.box2 .left2 .container2 {
	padding-right: 2px;
	padding-left: 0;
}

.box2 .right2 {
	float: right;
	width: 350px;
	margin: 0;
	position: relative;
}

.box2 .right2 .container2 {
	padding-left: 2px;
	padding-right: 0;
}

/* Lists */

ul.news, ul.sidemenu, ul.resources {
	list-style: none;
	padding: 0; /* needed for FF and Opera */
	margin: 0; /* needed for IE */
}

ul.sidemenu li, ul.resources li {
	padding-left: .8em;
	margin-bottom: .5em;
	margin-top: 1em;
	line-height: 1.2em;
	text-align: left;
}

/* Inserted in relevant places in various pages */
.tab {
	width: 237px;
	height: 59px;
	background: url('/images/bg/tab.png') no-repeat;
	text-align: left;
	padding-left: 30px;
	padding-top: 10px;
}
.dksmltab {
	width: 185px;
	height: 83px;
	background: url('/images/bg/graytab.png') no-repeat;
	text-align: left;
	padding-left: 30px;
	padding-top: 15px;
}

.dksmltab a {
	color: aqua;
	border-bottom: 1px aqua dotted;
	font-weight: bold;
}

.smltab {
	width: 185px;
	height: 83px;
	background: url('/images/bg/smltab.png') no-repeat;
	text-align: left;
	padding-left: 50px;
}

ul.links {
	width: 514px;
	height: 47px;
	list-style: none;
	padding: 9px 0 0 30px;
	border:1px black solid;
	font-size: 1.3
}

ul.links li {
	background-image: url("/images/lists/bullet.gif");
	background-repeat: no-repeat;
	background-position: 0.1em .4em;
	padding-left: .8em;
}

ul#up {
	list-style: none;
	padding: 0 0 0.5em 0;
	margin: 0 0 0.2em 0;
	border-bottom: 1px #ccc dotted;
}

ul.sidemenu li.up {
	padding: 0.5em 0 0 .8em;
	margin: 0;
	line-height: 1.2em;
	text-align: left;
	color:#364f64;
}
ul.resources li {
	margin: 0;
}

ul.home_products {
	list-style: none;
	margin: 3px 0 10px 0;
	padding: 0;
}
ul.home_products li, ul.home_products_2col li {
	display: inline;
	padding-left: .6em;
	padding-right: 1em;
	margin-bottom: .5em;
	line-height: 1.1em;
}

ul.home_products_2col {
	list-style: none;
	margin: 3px 0 3px 0;
	padding: 0;
}

ul.main {	list-style: none; margin: 0; padding: 0; 	}
ul.main li {	margin-top: 0.5em;	}

ul.centered {
	list-style: none;
	text-align: center;
	margin: 1em;
	padding: 1em;
}
ul.centered li {	margin:0; padding:1em; border: 1px solid #ccc; border-bottom:none;	}

ul.prices {
	list-style: none;
	padding: 0;
	margin: .5em;
}
ul.prices li {
	padding-left: .8em;
	line-height: 1.2em;
	text-align: left;
}
ul.prices li a:link, ul.prices li a:visited, ul.prices li a:hover, ul.prices li a:hover, ul.prices li a:active {
	font-size: 1em;
}

ol {
	padding: 1em;
	margin: 1em;
}

ol li {
	margin-bottom: .5em;
	line-height: 1.1em;
}

/* Used on the Technical Papers page */
ol.papers li {
	margin-bottom: 0.5em;
	padding-bottom: 1em;
	border-bottom: 1px dotted Black;
}
ol.papers li .lnk { margin-left: 2em; margin-top: 4px; }

/* Used in left columns for Product Descriptions */
ul.proddesc li {
	list-style: none;
	text-align: left;
	margin-bottom: .5em;
	margin-top: .2em;
	line-height: 1.1em;
}

/* Tables */
table {
	font: inherit;
}

table.pricelist, table.news, table.chinese {
	text-align: left;
	margin: 0;
	margin-top: 1em;
	padding: 5px;
	width: 100%;
	border-collapse:separate;
}

table.emigma7775 {
	text-align: left;
	margin: 0;
	margin-top: 1em;
	padding: 1px;
	width: 100%;
	border-collapse:separate;
}

table.emigma7775 td div, table.pricelist td div {
	margin: 2px;
}

table.emigma7775 thead, table.emigma7775 td div.title, table.pricelist thead {
	font-size: 130%;
	font-weight: bold;
	text-align: center;
	line-height: 1.1em;
}

table.pricelist thead {
	text-align: left;
}

table.pricelist td {
	padding: 2px 0;
}

table.chinese td {
	padding: 2px 0;
	font-size: 13px;
}

tr.tdpad td{
	padding: 10px 0;
	line-height:1.3em;
}

table.chinese td.colhead{
	font-size: 17px;
	font-weight: bold;
	padding: 5px;
}

table.chinese thead td {
	font-size: 25px;
	font-weight: bold;
	line-height: 2em;
}

table.news thead {
	text-align: center;
	font-weight: bold;
}

table.news tbody td {
	border-top: 1px solid Gray;
	padding: 3px;
}

table.emigma7775 tr {
	background-color: #99a6b0;
}

table.emigma7775 tr.subtitle {
	background-color: #829bb0;
}

table.emigma7775 td div.subtitle {
	font-size: 110%;
	font-weight: bold;
	text-align: center;
	letter-spacing: 1em;
}

table.reseller td {
	vertical-align:top;
}

table.blue {
	border: 2px #99a6b0 solid;
}

table.brown {
	border: 2px #b09e82 solid;
}

table.green2 {
	border: 2px #99a6b0 solid;
}

table.green {
	border: 2px #667f6d solid;
}

table.yellow {
	border: 2px #829bb0 solid;
}

.oddrow td {
	background-color:#b1c0cc;
}

.evenrow td {
	background-color:#ccc;
}

table.brown .oddrow td{
	background-color:#ccbfab;
}

table.brown .evenrow td{
	background-color:#e4d5bf;
}

/* Images */
img {	border: 0;	}
a:link img, a:visited img, a:hover img, a:active img {	border:0; text-decoration:none;	} /* doesn't seem to work */
img.mid {	vertical-align: middle;	}

#lightbox{
	color: #444;
	background-color:#eee;
	padding: 10px;
	border: 1px solid Black;
	z-index: 99999;
}
#lightbox a {	border:0; text-decoration:none;	}
#lightboxDetails{
	font-size: 0.8em;
	padding-top: 0.4em;
}
#lightboxCaption{ float: left; }
#keyboardMsg{ float: right; }
#closeButton{ top: 5px; right: 5px; }

#lightbox img{ border: none; clear: both;}
#overlay img{ border: none; }

#overlay{ background-image: url('/images/bg/lb_overlay.png'); }

* html #overlay{
	background-color: #333;
	back\ground-color: transparent;
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/images/bg/lb_overlay.png", sizingMethod="scale");
}


/* Thumbnails */

div.thumb {
	margin-bottom: 1.5em;
	width: auto;
}

/* Thumbnail container */
div.thumb div.tcontain {
	border: 1px #000 solid;
	padding: 5px;
	text-align: center;
	overflow: hidden;
}

/* Align thumbnail right */
div.tright {
	clear: right;
	float: right;
	margin-left: 1em;
}

/* Align thumbnail left */
div.tleft {
	float: left;
	margin-right: 25px;
}

div.enlarge {
	font-size: 0.8em;
	font-style: italic;
}

div.description {
	font-weight: bold;
}

/* Forms */
form {
	margin: 0;
	padding: 0;
}

input {
	border: 1px #000 solid;
}

textarea {
	border: 1px #000 solid;
	font-family: Verdana, sans-serif;
	font-size: 1em;
	color: #444;
	font-weight: bold;
}

.field {
	font: 1em Verdana, sans-serif;
	color: #444;
	font-weight: bold;
}

.field_noborder {
	font: 1em Verdana, sans-serif;
	color: #444;
	font-weight: bold;
	border: 0;
}

select.basestyle {
	font: 1em Verdana, sans-serif;
	color: #444;
	font-weight: bold;
}

/* Misc */

/* Text */
.small {
	font-size: x-small;
}

/* Align */
.center {
	text-align: center;
}

.justify {
	text-align: justify;
}

/* Paragraphs */
#main .container p.half_p {
	margin-top: 0;
	margin-bottom: 0.5em;
}

/* News Articles */
#main .container div.article_head {
	border-left: 3px solid Gray;
	padding-left: 2em;
	margin-top: 1em;
	font-style: italic;
}

#main .container div.article_body {
	border: 1px solid #c2c2c2;
	background: #f6f6f6;
	padding: 1em;
	line-height: 1.3em;
}

/* Highlights */
.highlight_orange { color: #f93; }

.highlight_red { color: #f00; }

.highlight_red2 { color: #c00; }

.highlight_blue { color: #009; }

.highlight_green { color: #073; }

/* "Notice" Paragraphs/Divs/Spans */
div.ltnotice {
	width: 473px;
	height: 46px;
	padding: 10px 10px 0px 30px;
	text-align: center;
	color: black;
	margin: 0 0 10px 120px;
	border:1px solid black;
}

div.noticebg {
	width: 473px;
	height: 75px;
	padding-bottom: 20px;
	text-align: center;
	color: black;
	border:1px solid black;
	background-color: #ffddff;
	margin: auto;
}

.linenotice {
	width: 496px;
	background: url('/images/bg/hmnotice.png') no-repeat;
	margin: 0.5em 0em 0.5em 250px;
	padding: 0.2em;
	text-align: center;
	color: white;
}
div.indent {
	margin-left: 40px;
}

div.notice {
	border:1px black solid;
	text-align: center;
	color: black;
	margin-top: 1em;
	margin-bottom: 1em;
	padding:20px;
}

div.sidemenu {
	line-height: 1.3em;
}

div.sidemenu #tableicn {
	margin-bottom: 1.5em;
}

div.box {
	background: url('/images/bg/monornd.png') no-repeat;
	margin-top: 1em;
	padding: 3em 0.5em;
	text-align: center;
	height:154px;
}

.basicbox {
	margin-top: 1em;
	padding: 2em 1em;
	text-align: center;
	height: 360px;
	border:2px solid black;
}

ul.news .entry {
	margin: 5px 10px;
	width: 330px;
}

ul.news .entry p { margin:0; }

div.button {
	margin: 1em;
	padding: 0;
}
div.button span { padding-bottom: 1px; }
div.button a.pdfLink, div.button a.pdfLink:link {
	text-decoration: underline;
	border: 1px solid Gray;
	background-color: #f6f6f6;
	font-weight: bold;
	padding: .5em 1em;
	position: relative;
}
div.button a.pdfLink:hover {
	border: 1px solid black;
	background-color: #ffeeff;
}
div.button a img { vertical-align: middle; }

div.floatRight { float: right; width: auto; }
div.floatLeft { float: left; width: auto; }

/* HRs */
hr {
	width: 80%;
	text-align: center;
	border: none;
	border-bottom: 1px solid #000;
}

.errorpage {
	text-align: center;
	padding: 2.5em 2em;
	margin: 20% auto 0;
	width: 460px;
	background: url('/images/bg/error.png') no-repeat;
}

div.bevelled_btn {
	height: 1.5em;
	width: 3.5em;
	position: relative;
	font-family: Verdana, Sans-serif;
	font-size: 10px;
	font-weight: bold;
	text-decoration: none;
	text-align: center;
	color: white;
	background-color: #364F64;
	border: 1px solid;
	border-color: #FFF #000 #000 #FFF;
	padding: 0px 3px 1px 3px;
	margin: 0;
}

ol.wide li {
	margin: 20px 0;
}

table#chktable tr td input {
	border-style: none;
}

#video_notice{
	font-size:13px;
	color:#364f64;
	line-height:25px;
	font-weight:bold;
}

.announcetext{
	font-size:13px;
	font-weight:bold;
	line-height:20px;
}

.seablue {
	color:#007;
	line-height:30px;
	font-size:25px;
}

.seablue #heavy, .seablue a:visited {
	font-weight:bold;
	color:#007;
}

#homepanels {
	width: 1024px;
	margin: 0px auto 20px;
	text-align: left;
	position: relative;
	background-color: black;
}

#transport {
	position: absolute;
	left: 0px;
	top: 0px;
}

#transport img {
	position: relative;
	float:left;
}

.mod_date {
	text-align: right;
}

/* nav */
.parent{
	position:relative
}
.topnav > ul {
	padding: 0;
	display: flex;
	justify-content: space-around;
	list-style: none;
}
#nav-btn a{
	color: inherit;
	text-decoration: none;
}
#nav-btn{
	display: none;
	font-size: xx-large;
	line-height: 40px;
	margin-left: 5px;
}
.parent:hover > ul {
	display:flex;
	flex-direction: column;
}
.child {
	position:absolute;
	display: none;
	list-style: none;
	padding: 0;
	background-color: white;
	line-height:2.0em;
	width: auto;
	z-index: 1;
	border: 1px #b8b4ae solid;
}
.child li {
	white-space: nowrap;
	border-top: 2px white solid;
	border-bottom: 2px white solid;
}
.child li a{
	text-decoration: none;
	margin: 5px;
	border: none;
}
.child li:hover {
	border-top: 2px black solid;
	border-bottom: 2px black solid;
}
ul ul ul{
	left: 100%;
	top: -3px;
}

/*top menu items*/
#nav > ul > li > ul{
	margin-top: 1px;
}
#nav > ul > li > a{
	text-decoration: none;
	border-bottom: 2px white solid;
}
#nav > ul > li:hover > a{
	border-bottom: 2px black solid;
}
#nav > ul > li.parent:hover a{
	border-bottom: 2px white solid;
}
input[type=checkbox]{
	display:none;
}

input[type=checkbox] + label{
	display:none;
}

.boxrow {
	display:flex;
	column-gap: 37px;
}

.prices_info {
	border: 1px black solid;
	padding: 20px;
	width: 550px;
}

.shipctrl {
	text-align: right;
	margin-bottom: 5px;
}


.row {
	display: flex;
	margin-bottom: 5px;
}
.col1 {
	flex: 1;
}
.col2 {
	flex: 3;
}

@media all and (max-width: 1680px){
	.boxrow {
	margin-right: 10px;
	justify-content: space-between;	
	flex-wrap: wrap;
	column-gap: 0px;
	}
}

@media all and (max-width: 1024px){
	#container {
	padding: 0 10px;
	width: 95%;
	}
	#banner{
	flex-direction: column;
	}
	div.noticebg {
	width: 100%;
	height: 75px;
	}
/* generic page */
	#content {
	width: 100%;
	}
	#side{
	display:none;
	}
	#main {
	width: 100%;
	}

}

@media all and (max-width: 650px){
/* banner */
	#banner_text img{
	width: 100%;
	}
	#banner_logo img{
	width: 65%;
	}
/* menu */
	#nav-btn{
	display: block;
	}
	.topnav ul {
	display: none;
	padding: 0;
	margin: 0;
	font-size: 20px;
	line-height: 40px;
	}
	.topnav.responsive > ul{
	flex-direction: column;
	display: flex;
	}
	.topnav ul li a{
	margin: 0 30px;
	}
	.child {
		position:static;
		border: none;
	}
	.topnav li {
	white-space: nowrap;
	border: 1px #b8b4ae solid;
	}
	.topnav li:hover {
	border-top: 2px black solid;
	border-bottom: 2px black solid;
	}
	#nav > ul > li:hover > a{
	border: none;
	}
	.parent:hover > ul {
	display:none;
	}

	input[type=checkbox] + label{
	display:inline;
	}

	input[type=checkbox]:checked ~ .child{
	display:flex;
	flex-direction:column;
	}
/* home page */
	.roundbox{
	flex-direction: column;
	}
	.roundbox div{
	padding: 0 10px;
	}
	#servicesbox img{
	width: 100%;
	height: auto;
	}
	.announcetext{
	font-size: 1.3em;
	}
	.announcediv{
	margin-bottom: 15px;
	}
	#searchbutton {
	margin-left: 15px;
	}
	.prices_info {
	width: 90%;
	}
}