﻿/***** BEGIN RESET *****/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	background: transparent;
	border: 0;
	margin: 0;
	padding: 0;	
	box-sizing: border-box;
}

ol, ul {
	list-style: none;
}

body {
	overflow-x: hidden;
	font-family: 'Montserrat', sans-serif;
}

table{border-collapse:collapse; width:100%;}
td{vertical-align:top;}

/* Make HTML 5 elements display block-level for consistent styling */  
header, nav, article, footer, address, img {  
    display: block;  
} 

/***** END RESET *****/

/* Clearfix */
.cf:before,
.cf:after {
    content: " ";
    display: table;
}
.cf:after {
    clear: both;
}
.cf {
    *zoom: 1;
}
*, *:before, *:after {
  box-sizing: inherit; }


@import url('https://fonts.googleapis.com/css?family=Montserrat:300,700');
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,700');


body {font-family: 'Montserrat', sans-serif; line-height: 1.5; -webkit-text-size-adjust:none;}
h1 {font-family: 'Montserrat', sans-serif; font-size: 30px;}
h2 span {font-family: 'Montserrat', sans-serif; font-weight: 700; color: #cc0000;}
strong {font-family: 'Montserrat', sans-serif; font-weight: 700;}
a:link, a:visited, a:active {text-decoration:none; color:#cc0000; font-family: 'Montserrat', sans-serif;}
a:hover {text-decoration: none; color:#000;}

header {max-width: 100%; background: #cc0000 !important; height: auto;}
.logo {background: #cc0000 !important; display: inline-block; float: left; width: 20%; max-width: 100%; height: auto; box-sizing: border-box;}
.logo img {max-width: 100%; height: auto; text-align: center; display: inline-block;}
.address1 {width: 100%; color: #fff; background: #272727 url(../siteart/dark_fish_skin.png); padding: 10px 0px; font-size: 14px;}
	.address1 span {padding: 0 15px; border-right: 1px solid #fff;}
	.address1 .last {border: 0px;}
.address1 a:link, .address1 a:visited, .address1 a:active {text-decoration:none; color:#fff; font-family: 'Montserrat', sans-serif;}
.address1 a:hover {text-decoration: underline; color:#fff;}
	
.wrapper {width: 80%; max-width: 100%; margin: 0 auto; padding: 30px 0px;}
.filler {padding: 20% 0px;}

.two-cols {width: 50%; max-width: 100%; display: inline-block; vertical-align: top; box-sizing: border-box;}
.tile-wrapper {width: 80%; max-width: 100%; margin: 0 auto; text-align: center; padding: 30px 0px;}
.tile-wrapper img {max-width: 100%; height: auto;}
.half {max-width: 100%; display: inline-block; box-sizing: border-box; padding: 10px; position: relative; z-index: 9;}
.half-half {width: 50%; max-width: 100%; display: inline-block; box-sizing: border-box; padding: 10px; position: relative; z-index: 9;}
.tile-text {max-width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); font-size: 18px; font-family: 'Montserrat', sans-serif;  font-weight: 700;}
.half:hover, .half-half:hover {opacity: 0.6; filter: alpha(opacity=60);}
.tile-wrapper a:link, .tile-wrapper a:visited, .tile-wrapper a:active {text-decoration:none; color:#fff; font-family: 'Montserrat', sans-serif; transition: .3s ease-in-out all; background-color: #000;}
.tile-wrapper a:hover {text-decoration: none; color:#cc0000; transition: .3s ease-in-out all;}

form header {margin: 0 0 20px 0;}
form header div {font-size: 90%; color: #999;}
form header h2 {margin: 0 0 5px 0;}
form > div {clear: both; overflow: hidden; padding: 1px; margin: 0 0 10px 0; -webkit-appearance: none;}
form > div > fieldset > div > div {margin: 0 0 5px 0;}
form > div > label, legend {width: 25%; float: left; font-size: 14px;}
form > div > div, form > div > fieldset > div {width: 75%; float: right;}
form > div > fieldset label {font-size: 90%;}
fieldset {border: 0;padding: 0;}
input[type=text], input[type=email], input[type=url], input[type=password], textarea {width: 100%; border: 1px solid #000; padding: 5px; box-sizing: border-box;}
input[type=text], input[type=email], input[type=url], input[type=password] {width: 100%;}
input[type=text]:focus, input[type=email]:focus, input[type=url]:focus, input[type=password]:focus, textarea:focus {outline: 0; border-color: 1px solid #ed3338;}
select {-webkit-appearance: none; -moz-appearance: none; appearance: none; width: 100%; float: right; padding: 5px;}
input.button, input.button:focus, div.button, div.button:focus {width: 75%; float: right; padding: 7px 0; background: #cc0000; border: none; text-align: center; font-family: 'Montserrat'; color: #fff;-webkit-appearance: none; box-sizing: border-box;}
input.button:hover, div.button:hover {background: none; color: #fff; background: #000; cursor: pointer; transition:all .2s ease-in-out; -moz-transition:all .2s ease-in-out; -webkit-transition:all .2s ease-in-out; box-sizing: border-box;}

/* control the Captcha */
.CaptchaPanel {margin: 0 0 0 0 !important; padding: 0 0 0 0 !important; text-align: center; line-height: normal !important; width: 75%;}
.CaptchaPanel img {margin: 0 auto;}
.CaptchaImagePanel {margin: 0 0 0 0; padding: 0 0 0 0;}
.CaptchaMessagePanel {padding: 0 0 0 0 !important; margin: 0 0 0 0 !important; font-weight: normal !important; font-size: 12px; line-height: 14px;}
.CaptchaAnswerPanel {margin: 0 0 0 0; padding: 2px 0px 2px 0px !important;}
.CaptchaWhatsThisPanel {line-height: 0; margin: 0 0 0 0; padding: 8px 0 8px 0 !important;}
.CaptchaWhatsThisPanel a {color: #000;}
.CaptchaWhatsThisPanel a:hover {text-decoration: none;}

.hosted-content .pagination > .drop-down-form select {float: none !important; width: 50px !important;}

.footer {max-width: 100%; font-size: 14px; line-height: 1.5; color: #fff; background: #cc0000; padding: 30px 0px;}
a.footerlink:link, a.footerlink:visited, a.footerlink:active {text-decoration:underline; font-family:'Montserrat', sans-serif;font-size:13px; color: #fff;}
a.footerlink:hover {text-decoration:none; font-family:'Montserrat', sans-serif;font-size:13px;}
.footertext {font-family:'Montserrat', sans-serif;font-size:13px; color:#fff;}
.smallfootertext {font-family:'Montserrat', sans-serif;font-size:10px; color:#fff;}
.divfooter {width: 80%; text-align: center; margin: 0 auto; color: #fff;}

.hosted-content .attachment-search .search-header {width:100%;}
.hosted-content .cf {width:100%;}

/************************************************ Responsive Styles ************************************************/
@media screen and (max-width: 1680px){
.logo {float: none; width: 100%; text-align: center;}
}

@media screen and (max-width: 1023px){

}

@media screen and (max-width: 800px){
body {font-size: 14px;}
h1 {font-size: 20px;}

.logo {float: none; width: 100%; text-align: center;}
.address1 {padding: 10px 0px; font-size: 12px; text-align: center;}
	.address1 span {padding: 0 8px; border-right: 1px solid #fff;}

.two-cols {width: 100%;}
.four-cols {width: 50%}

.half {padding: 10px 10px 10px 0;}
.half-half {padding: 10px 10px 10px 0;}

}
 
 

@media screen and (max-width: 667px){
.address1 {padding: 8px 0px; font-size: 12px; text-align: center;}
	.address1 span {padding: 0 8px; border-right: 0px solid #fff;}
.address-hide {display: none; border: 0px;}

}


@media screen and (max-width: 320px){
.four-cols {width: 100%; }
}
