/*  ********** body *********** */

body {font-family: 'Muli', sans-serif; color: #2A838E; margin: auto;  text-align: center; background: #87B4BE url(../images/houndstoothbg.jpg); overflow:auto; padding: 0}

@media screen and (max-width:400px) {

    body {font-size: 2em}

}

.clearfix {clear:both}

.center {margin:auto; text-align: center}

.imghldr {text-align: center; margin-left: auto; margin-right: auto; margin-top:60px;}

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

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



/*  ********** header *********** */

.dec_strip {positon: relative; padding: 0; margin: 0; height: 50px; width: 100%; background: #87B4BE url(../images/houndstoothbg.jpg); z-index: 900}

.topsec {position: relative; padding-bottom: 30px; top: 20px; background: transparent; max-width:900px; float: left; overflow: hidden;  z-index: 300;}

.logo {position: relative; max-width: 350px; padding-top: 10px; padding-left: 20px; background: transparent; float: left}

@media screen and (max-width:400px) {

    .logo {float: none; padding-left: 0}

}

.dogs {float: right; max-width: 350px; max-height: 300px; padding-top: 40px; padding-right: 20px; vertical-align: bottom}

@media screen and (max-width:400px) {

    .dogs {float: left; padding: 10px}

}

#topcont {margin-bottom: 55px; position: relative; width: 100%; background: #E7DBC7; overflow: hidden;  z-index: 500; clear:both}



/*  ********** main navigation *********** */

#icons {}

#topicons {float: left; width: 300px; max-height: 37px; position: relative; text-align: center; margin: auto; padding-bottom: 40px;  font: normal 12px Arial; color:#A27960;  z-index: 100;  clear: both}

#iconlt ul {display: inline-table; padding-top: 10px; padding-bottom: 0px; list-style-type: none; text-align: center; background: transparent;  clear: both}

#iconlt ul li {display: inline; padding-right: 5px;}

#iconlt ul li a {text-decoration: none; border: none}

.toolicon{font-family:verdana, arial, helvetica, sans-serif; font-size:10px; text-align: left;}

a.toolicon:hover {background:transparent;text-decoration:none;}

a.toolicon span {display:none; padding: 2px 4px 2px 2px; margin-top:37px; margin-left:0px; margin-right: 10px; width:100px;}

a.toolicon:hover span{display:inline; position:absolute; background:#E7DBC7; color:#2A838E; z-index:1;}

.btmicon {text-align: left; padding: 10px;}

.midicon {text-align: left; padding: 20px;}





/*  ********** text colors *********** */

.textcrbg {margin-top: 0px; font-family: 'Muli', sans-serif; font-weight: 550; font-size: 1.2em; line-height: 1.25em; color: #36260B; padding:5px 50px; text-align: justify;}

@media screen and (max-width:480px) {

    .textcrbg {margin-top: 30px; padding:5px 15px; font-size: 18px; text-align: left;}

}

.textbrnbg {font-family: 'Muli', sans-serif; font-weight: 550; font-size: 1.2em; line-height: 1.25em; color: #E7DBC7; padding:5px 50px; text-align: justify; }

@media screen and (max-width:480px) {

    .textbrnbg {padding:5px 15px; font-size: 18px; text-align: left;}

}

.textbrnbg a, .textwtbg a:visited {color: #57922B; text-decoration:underline;}

.textbrnbg a:hover {color:#2A838E; background:transparent; text-decoration:overline; cursor: pointer;}

.textblbg {margin-top: 10px; font-family: 'Muli', sans-serif; font-weight: 550; font-size: 1.2em; color: #36260B; line-height: 1.25em; padding:5px 50px; text-align: left;}
@media screen and (max-width:700px) {

    .textblbg {font-size: 20px; text-align: left;}

}




/*  ********** section colors *********** */

.blusec {overflow: hidden; margin-right: auto; margin-left: auto;  margin-top: 0; margin-bottom: 55px; max-width: 100%; text-align: center; background: #86B4BE url(../images/blusecbg.jpg); padding: 25px 0px 15px 0px; clear: both; !important;}

@media screen and (max-width:400px) {

   .brnsec {margin-bottom: 0px}

}

.brnsec {overflow: hidden; margin-right: auto; margin-left: auto;  margin-top: 30px; margin-bottom: 55px; max-width: 100%; text-align: center; background: #36260B url(../images/blusecbg.jpg); padding: 10px 0px 15px 0px;}

@media screen and (max-width:400px) {

   .brnsec {margin-bottom: 0px}

}

@media screen and (max-width:400px) {

   .blusec {padding: 15px 0px 0px 0px;}

}



/*  ********** titles *********** */

}

.titlblu {font-family: 'Noto Sans', sans-serif; font-weight: 550; font-size: 2.6em; color: #87B4BE; padding-left: 20px; text-align: left;}

@media screen and (max-width:480px) {

   .titlblu {font-size: 30px}

}

.titlcr {font-family: 'Noto Sans', sans-serif; font-weight: 550; font-size: 2.6em; color: #E7DBC7; padding-left: 20px; text-align: left;}

@media screen and (max-width:480px) {

   .titlcr {font-size: 30px}

}

.titlbr {font-family: 'Noto Sans', sans-serif; font-weight: 550; font-size: 2.6em; color: #36260B; padding-left: 20px; text-align: left;}

@media screen and (max-width:480px) {

   .titlbr {font-size: 30px}

}



/*  ********** columns *********** */

.col {overflow: hidden; background: transparent; position: relative; margin-right: auto; margin-left: auto;  margin-top: 1%; max-width: 45%; text-align: center; display:inline-block; vertical-align:top;}

@media screen and (max-width:900px) {

    .col {max-width: 95%;min-width: 95%}

}

.colul {display:inline-block; padding: 0; margin:0px;}

.colli {display:block; padding-top: 15px; padding-bottom: 15px; margin: -10px 0 0 25px; list-style-image: url("../images/tiny_paw_icon.png"); font:500 1.1em Muli, sans-serif; color:#36260B; line-height: 1.25em}

@media screen and (max-width: 400px) {

   .colli {margin: -10px 0 0 -25px; text-align: left}

}

.plcolli {display:block; padding-top: 15px; padding-bottom: 15px; margin: -10px 0 0 25px; list-style-type:none; font:500 1.1em Muli, sans-serif; color:#36260B; line-height: 1.25em}

@media screen and (max-width: 400px) {

   .plcolli {margin: -10px 0 0 -25px; text-align: left}

}

.servtitle {font-family: 'Noto Sans', sans-serif; font-weight: 575; font-size: 1.5em; color: #4D3815; line-height: 1.25em; text-align: left; vertical-align:bottom; padding-bottom: 5px; padding-left: 0px; text-align: left;}

@media screen and (max-width: 400px) {

   .servtitle {font-size: 25px}

}

/*  ********** floats *********** */

.floatleft {position: relative; padding-right: 6px; padding-right: 25px; padding-top: 25px; padding-bottom: 0px; width: auto; height: auto; float: left;} 

@media screen and (max-width:480px) {

   .floatleft {float: none;}

}

.floatright {position: relative; padding-right: 0px; padding-left: 20px; padding-top: 25px; padding-bottom: 0px; width: auto; height: auto; float: right;}

@media screen and (max-width:480px) {

   .floatright {float: none;}

}

.floatrightalt {position: relative; padding-right: 0px; padding-left: 60px; padding-top: 25px; padding-bottom: 0px; width: auto; height: auto; float: right;}

@media screen and (max-width:480px) {

   .floatright {float: none;}

}



/*  ********** footer *********** */

#footerfrnt {background: #E7DBC7; margin-right: auto; margin-left: auto;  text-align: center; margin-top: 25px; padding: 15px; clear:both; max-width: 100%;  clear:both}

#endtitle {font-family: arial, verdana, "Courier New"; font-size: .90em; font-weight: normal; text-align: left; color: #fff; padding: 0 0 10px 10px;}

#bttm {width: 100%}

.btmlinks {overflow: hidden; margin-left: 50px; padding-bottom: 20px; text-align: left; float: left; overflow: auto; vertical-align: top; width: 28%}

@media screen and (max-width: 680px) {

   .btmlinks {width: 100%; float: none; margin-left: 5px}

}

.bttmtitle {font-family: 'Noto Sans', sans-serif; font-weight: 700; font-size: 1.3em; color: #87B4BE; line-height: 1.35em; text-align: left; vertical-align:top; padding-bottom: 5px; padding-left: 16px; text-align: left;}

.bttmtitle a, .bttmtitle a:visited {color: #87B4BE; text-decoration:none;}

.bttmtitle a:hover {color:#BBCA61; background:transparent; text-decoration:underline; cursor: pointer;}

@media screen and (max-width: 400px) {

   .bttmtitle {font-size: 60%}

}

.plain {display: inline-block; padding: 0px; text-align: left}

.plainul {overflow: hidden; display:inline-block; padding: 0; margin:0px;}

.plainli {display:block; padding-top: 15px; padding-bottom: 15px; margin:-10px 0 0 -25px; list-style-type:none; font:500 1.1em Muli, sans-serif; color:#36260B; line-height: 1.25em}

@media screen and (max-width: 400px) {

   .plainli {font-size: 50%}

}

.botmenuspc {margin: 0; text-align:left; padding: 5px 0 10px 0;}

.botmenu {font-family: arial, verdana, "Courier New", "Times New Roman", Helvetica; font-size: .80em; font-weight: normal; color: #CCAB62; text-align:left; padding:  0 10px 0 0;}

.navbot {display:inline-block;}

.navbot {display:inline;}

.strip {display:table;}

.navbot {display:table-row; padding:0; margin:0; list-style-type:none; white-space:nowrap;}

.navbot li {display:inline; font: 500 .70em Arial, Helvetica, sans-serif; display:block; float:left; padding:4px 12px; color:#36260B;}

@media screen and (max-width: 400px) {

.navbot li {font-size: 35%}

}

.navbot a, .navbot a:visited {padding:4px 12px; color:#36260B; background:transparent; text-decoration:none;}

.navbot a:hover {color:#86B4BE; background:transparent; text-decoration:underline; cursor: pointer;}

#botmenu {margin: auto; text-align: center; padding-bottom: 30px; padding-top: 10px; max-width: 100%; clear:both}

#botmenu .strip {text-align:left;}

#toTop {
	display:none;
	text-decoration:none;
	position:fixed;
	bottom:10px;
	right:10px;
	overflow:hidden;
	width:41px;
	height:41px;
	border:none;
	text-indent:100%;
	background:url(../img/ui.totop.png) no-repeat left top;
}

#toTopHover {
	background:url(../img/ui.totop.png) no-repeat left -41px;
	width:41px;
	height:41px;
	display:block;
	overflow:hidden;
	float:left;
	opacity: 0;
	-moz-opacity: 0;
	filter:alpha(opacity=0);
}

#toTop:active, #toTop:focus {
	outline:none;
}