﻿/* Default CSS */

body {
	font-size: 100%;
	font-family:Segoe, 'Segoe UI', 'Helvetica Neue', sans-serif;
	background: #FFFFFF;
	padding:0;
	margin: 0;
}
.textstyle2 { font-size:22pt; color:#008300; font-weight:bold; }
.textstyle4 { font-size:12pt;  color:#008300; font-weight:bold;  white-space: nowrap; }
.textstyle4-centre { text-align:center; font-size:12pt;  color:#008300; font-weight:bold;  white-space: nowrap; }

#content {
	margin: 0em 0em 0px 0em;
	padding: 5em 0em 0em 0em;
	border-bottom: 1px solid #000000;
	position: relative;
}
#content a {
	color: #333300;
}
#content a:hover {
	text-decoration: none;
}
#content ul {
	margin: 0.4em 0em 0px 0em;
	list-style: square;
	padding-top: 0em;
	padding-bottom: 0em;
	padding-right: 0.5em;
	padding-left: 2em;
}
#content li{
	padding-right: 0.5em;
	padding-top: 0.1em;
	padding-bottom: 0.1em;
}

#content p {
	margin:  0.2em 0em 0.2em 0em;
	padding: 0.2em 0.5em 0.2em 2em;
	text-align: justify;
}
#footer p {
	padding-top: 5px;
	color: #000000;
	letter-spacing: 0.5em;
	padding-bottom: 5px;
	text-align: center;
	font-size: 60%;
    vertical-align: bottom;
	position:relative;
	display: inline-block;
	width:100%;
}
h1 {
	margin: 0px;
	padding: 0em 0em 0em 0.5em;
	color: #008300;
	border-bottom: 10px solid #333333;
	font-size: 200%;
}
h2 {
	color: #FFFFFF;
	margin-top: 0em;
	margin-bottom: 0em;
	margin-left: 0em;
	margin-right: 0em; 
	padding: 0.3em 0em 0.3em 0.3em;
	border-bottom: 1px solid #333333;
	border-left: 1px solid #333333;
	background: #008300;
	font-size: 175%;
	text-align: center;
}
h3 {
	color: #008300;
	padding-bottom: 0px;
	border-bottom: 1px solid #333333;
	margin-top: 0.2em;
	margin-bottom: 0px;
	padding-top: 0.2em;
	padding-left: 1.0em;
	font-size: 150%;
}
h4 {
	color: #008300;
	padding-top: 0.2em;
	padding-bottom: 0px;
	padding-left: 1.0em;
	margin-top: 0px;
	margin-bottom: 0px;
	font-size: 125%;
}

/* Menu CSS */

#menu_template a { text-decoration: none; }
#menu_template_pane { background-color: #FFFFFF; border: 1px solid #FFFFFF; padding-top: 10px; padding-bottom: 10px; box-shadow: 2px 2px 6px 0px rgba(8, 8, 8, 0.784314); }
#menu_template_hr { background-color: #FFFFFF; height: 1px; border: none; }
#menu_template_entry { padding-left: 10px; padding-right: 10px; padding-top: 1px; padding-bottom: 1px; }
#menu_template_entry:hover { background-color: #FFFFFF; color: #008300 !important; }
#menu_template_entry:hover span { color:#008300 !important; }
		.menu_template_mainMenuEntry { text-align: center; }
		.menu_template_mainMenuEntry:hover {	background-color:#FFFFFF; }
		.menu_template_mainMenuEntry:hover span {	color:#008300 !important; }
		#menu_template .mobileEntry { display: none; } 
		#menu_template .normalEntry { display: block; } 
		@media only screen and (max-width:900px) { 
			#menu_template .mobileEntry { display: block; } 
			#menu_template .normalEntry { display: none; } 
		}

#container_header { vertical-align: top;  display: inline-block; width:100%; min-height:70px; background-color:#FFFFFF; border-top: none; border-left: none; border-right: none; border-bottom: 10px solid #000000;  position: fixed; z-index: 100; }

#container_header a { color:#008300; font-weight:bold; } 
#container_header a:visited { color:#008300; } 
#container_header a:active { color:#008300; } 
#container_header a:hover { color:#008300; }
 
#container_logo { margin-left: 10px; margin-top: 10px; display: block; vertical-align: top; position:relative; display: inline-block; float:left; width:40%; background:none;  }

#button_logo { vertical-align: top; position:relative; display: inline-block; float:left; width:55px; height:55px; background-color:#FFFFFF; background-image: url(../assets/images/quartzlogoclear.png); background-position:center center; background-size:cover;  }
#button_companyname { vertical-align: 9px; position:relative; display: inline-block; width:80%; height:auto; background:none;  margin: 0px 0px 0px 10px;}

#container_menu { vertical-align: top; position:fixed; display: inline-block; float:right; width:40%; background:none; margin-top: 30px; }

#menu_template { vertical-align: top; position:relative; display: inline-block; float:left; width:100%; height:40px; text-align:left; background:none;  }
.menuholder1 { position: relative; overflow: hidden; width: 100%; height: 100%; }
.menuentry_text1 { position:absolute; top:0px; bottom:0px; left:0px; right:0px; margin-top:auto; margin-bottom:auto; margin-left:auto; margin-right:auto; height:33px;  }
.menuentry_text2 { position:absolute; top:0px; bottom:0px; left:0px; right:0px; margin-top:auto; margin-bottom:auto; margin-left:auto; margin-right:auto; height:21px;  }
.menustyle1 { position:absolute; width:37px; height:40px; left:10px;  }
.menustyle2 { position:absolute; width:66px; height:40px; left:10px;  }
.menustyle3 { position:absolute; width:93px; height:40px; left: 76px;  }
.menustyle4 { position:absolute; width:102px; height:40px; left:169px;  }

@media only screen and (max-width: 640px)
{
		#button_companyname * span { font-size:12pt;  }
}

/* General Purpose Containers */

video {
  width: 100%;
  height: auto;
}

.container_section {
    vertical-align: top;
    position: relative;
    display: inline-block;
    width: 100%;
    min-height: 200px;
    background: none;
	height: auto;
}

.container_section_centre {
    margin: auto;
    width: 50%;
    min-height: 200px;
    height: auto;
    background: none;
	padding-top:0.5em;
	padding-bottom: 0.5em;
	padding-left: 0.5em;
	padding-right: 0.5em;
}

.container_section_left {
    vertical-align: top;
    position: relative;
    display: inline-block;
    width: 48%;
    min-height: 200px;
	height: auto;
    background: none;
	padding-top:0.5em;
	padding-bottom: 0.5em;
	padding-left: 0.5em;
	padding-right: 0.5em;
	max-height: 400px;
}

.container_section_right {
    vertical-align: top;
    position: relative;
    display: inline-block;
    float: right;
    width: 48%;
    min-height: 200px;
	height: auto;
    background: none;
	padding-top:0.5em;
	padding-bottom: 0.5em;
	padding-left: 0.5em;
	padding-right: 0.5em;
	max-height: 400px;
}
