@charset "utf-8";
/* CSS Document */

/*
	Theme Name: Brand-It Web Design
	Theme URI: http://www.branditwebdesign.com
	Description: Brand-It Web Design theme by Brad Randolph.
	Author: Brad Randolph
*/


body {padding: 0px; margin: 0px; color: #666666; font-family: "Open Sans", sans-serif; font-size: 14px; -webkit-text-size-adjust: none;}
.wrapper {width: 100%; min-width: 320px; clear: both;}
.container {max-width: 1280px; padding: 0px 10px; margin: 0px auto; min-width: 300px;}
.container img {max-width: 100%;}

a {text-decoration: none; color: #0099a6;}
a:hover {color: #999;}
a img {border: none; -webkit-transition: all .1s linear; -moz-transition: all .1s linear; -ms-transition: all .1s linear; -o-transition: all .1s linear; transition: all .1s linear; }

a.logo img {position: relative; top: -4px; vertical-align: middle;}

h1, h2, h3, h4, h5 {margin: 15px 0px 10px; font-weight: 700; color: #464646; letter-spacing: -0.5px; font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;}
h4, h5 {letter-spacing: 0px;}
h1 {font-size: 30px;}
h2 {font-size: 25px;}
h3 {font-size: 20px;}
h4 {font-size: 16px;}
h5 {font-size: 14px;}

.page_heading {font-weight: 700; font-size: 30px; text-transform: uppercase; margin: 45px 0px 20px;}
.breaker {margin: 10px auto; width: 100px; height: 2px; display: block; background: #0099a6;}
.below_heading {margin: 20px 0px 45px; font-size: 14px; font-weight: 600;}

.m_l {margin: 10px 10px 10px 20px;}
.m_m {margin: 10px;}
.m_r {margin: 10px 20px 10px 10px;}
.cell_padding {padding: 15px;}

.padding10 {padding: 10px;}
.padding20 {padding: 20px;}
.padding1020 {padding: 10px 20px;}
.padding120 {padding: 1px 20px;}

.greybox {padding: 10px; /*background: #eaebee; border: 1px solid #c5c9cf;*/ background: #f8f8f8; border: 1px solid #ececec; -webkit-border-radius: 5px; border-radius: 5px;}
.container > .greybox {margin: 15px 0px;}
.last {margin-right: 0 !important;}

.clear {clear: both;}
.last {margin-right: 0px !important;}
.textaligncenter {text-align: center;}

.one_half, .one_fourth, .two_thirds, .one_third, .six_tenths, .four_tenths, .one_twelves, .one_sixth, .largeone_third, .smalltwo_thirds {display: block; float: left;}
.one_half {width: 50%;}
.one_fourth {width: 25%;}
.two_thirds {width: 66.67%;}
.one_third {width: 33.33%;}
.six_tenths {width: 60%;}
.four_tenths {width: 40%;}
.full_width {width: 100%;}
.one_twelves {width: 8.32%;}
.one_sixth {width: 16.65%;}
.largeone_third {width: 40%;}
.smalltwo_thirds {width: 60%;}

.greybg {background: #f2f3f3;}
.lightbg {background: #ffffff;}
.darkgreybg {background: #464646; color: #ffffff;}
.bluebg { background: #014176; border-bottom: 1px solid #002d53;}
.darkbluebg { background: #003058; border-top: 1px solide #002f56;}

a.button {padding: 10px 25px; display: inline-block; background: #0099a6; color: #ffffff; -webkit-transition: all .1s linear; -moz-transition: all .1s linear; -ms-transition: all .1s linear; -o-transition: all .1s linear; transition: all .1s linear;}
a.button:hover {background: #464646;}

.waytopbar {background: #464646; color: #ffffff; text-align: right; padding: 8px 0px;}
.waytopbar p {padding: 0px; margin: 0px;}
.waytopbar p a {color: #999999;}
.waytopbar p a:hover {color: #0099a6;}

.darkgreyborderbottom {border-bottom: 1px solid #333333;}
.darkgreybordertop {border-top: 1px solid #333333;}

.tealbg {background: #0099a6; color: #ffffff; font-size: 20px; padding: 20px 0px;}
.tealbg p {margin: 0px; line-height: 43px;}
.tealbg p a {float: right; margin-bottom: 0px; background: #464646; line-height: normal;}
.tealbg p a:hover {background: #666666;}

.homesection {padding-bottom: 40px;}

a.cta {background: #333333; padding: 20px 100px; margin: 35px auto 10px;}

.mainnavcontainer {height: 66px;}
a.logo {float: left; color: #0099a6; line-height: 66px; font-size: 30px; }
ul.mainnav {float: right; margin: 0px; -webkit-padding-start: 0px;}
ul.mainnav li {float: left; list-style-type: none;}
ul.mainnav li a {display: block; line-height: 66px; padding: 0px 15px; color: #464646; -webkit-transition: all .1s linear; -moz-transition: all .1s linear; -ms-transition: all .1s linear; -o-transition: all .1s linear; transition: all .1s linear; text-transform: uppercase; font-weight: 700; background: #f2f3f3; font-size: 16px;}
ul.mainnav li a:hover {background: #ffffff;}
ul.mainnav li:last-child {display: inline;}
ul.mainnav li:last-child a {background: #0099a6; color: #ffffff; padding: 12px 15px; margin-top: 12px; line-height: 16px; font-weight: 400; text-transform: none;}
ul.mainnav li:last-child a:hover {background: #464646;}

.slideshowhold img {width: 100%; display: block;}

.fadbg {height: 60px; width: 60px; background: #0099a6; line-height: 60px; border-radius: 50%; color: #ffffff; margin: 5px 0px;}

.serviceimage {display: block;}
.serviceimage img {width: 100%; display: block;}
.serviceimage span {display: block; padding: 10px; background: #0099a6; color: #ffffff;}
.serviceimage:hover span {background: #464646;}

.mobileshow {display: none;}

.wrapper_news p {font-size: 13px;}

.wrapper_footer {padding: 20px 0px; }
.wrapper_footer h4, .wrapper_footer h5 {color: #ffffff;}

/******************************
		Home Slider
******************************/
.slidehold {padding: 0px;}
.slidehold .slide1 {height: 485px; text-align: center;background: url(/images/layout/slide1.jpg) center center; max-width: 1557px; margin: 0px auto; min-width: 300px;}
.slidehold .slide1 h1 {color: #ffffff; font-size: 48px; display: block; font-weight: 400; margin: 0px; min-width: 280px; padding: 140px 10px 0px;}
.slidehold .slide1 h4 {color: #ffffff; font-size: 24px; display: inline-block; font-weight: 100; text-transform: none; max-width: 800px; padding: 0px 10px; margin: 24px 0px 6px;min-width: 280px;}
.slidehold .slide1 a.button {margin: 6px; background: #464646;}
.slidehold .slide1 a.button:hover { background: #0099a6;}



/***************************************************************************
							   CLIENT SECTION
***************************************************************************/
.subnavsection {padding: 8px 0 14px; color: #a6a5a5; position: relative;}
.subnavsection a {color: #cccccc; -moz-transition: all .1s linear;}
.subnavsection a:hover {color: #A6A5A5;}
#mainclientnav {margin-bottom: 2px;}


.homelogin form {padding: 15px; background: #eaebee; border: 1px solid #d3d5d9; -webkit-border-radius: 10px; border-radius: 10px; display: inline-block; max-width: 300px;}
.homelogin form input {border: 1px solid #d3d5d9; -webkit-border-radius: 5px; border-radius: 5px; padding: 2%; width: 96%; max-width: 300px; margin-bottom: 12px;}
.homelogin form textarea {border: 1px solid #d3d5d9; -webkit-border-radius: 5px; border-radius: 5px; padding: 2%; width: 96%; max-width: 300px; margin-bottom: 12px; height: 60px; overflow: auto; resize: none;}
.homelogin form input, .homelogin form textarea {font-family: Arial; color: #616161; font-size: 13px;}
.homelogin form input[type=radio] {width: 10px; float: left; margin-right: 8px;}
.homelogin form .radiohold {clear: both; text-align: left;}
.homelogin form input[type=submit] {margin-bottom: 0px;
	background: #e9e9ea; /* Old browsers */
	background: -moz-linear-gradient(top,  #e9e9ea 0%, #d6d7da 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e9e9ea), color-stop(100%,#d6d7da)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #e9e9ea 0%,#d6d7da 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #e9e9ea 0%,#d6d7da 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #e9e9ea 0%,#d6d7da 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #e9e9ea 0%,#d6d7da 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e9e9ea', endColorstr='#d6d7da',GradientType=0 ); /* IE6-9 */
}
.homelogin form input[type=submit]:hover {cursor: pointer; opacity: 0.7;}
h5.noteh5 {margin: 0px 0px 12px; text-transform: none;}
.main .subforms {text-align: center; margin: 5px 0 30px;}

h1.welcomenotice, h2.welcomenotice {text-transform: none; margin-bottom: 10px;}

ul.greyboxtabs {padding: 0px; margin: 0px 0px -11px 5px; list-style-type: none; height: 42px; position: relative; z-index: 20; overflow: hidden;}
ul.greyboxtabs li {float: left; display: inline;}
ul.greyboxtabs li a { background: #eaebee; border: 1px solid #c5c9cf; -webkit-border-radius: 5px 5px 0px 0px; border-radius: 5px 5px 0px 0px; display: block; padding: 6px 10px; color: #616161; text-decoration: none; -moz-transition: all .1s linear; font-size: 13px;}
ul.greyboxtabs li a:hover {background: #f4f4f4;}
ul.greyboxtabs li.active a { border-bottom: 1px solid #f8f8f8; background: #f8f8f8; }


ul.employeelist {padding: 0px; margin: 0px; list-style-type: none;}
ul.employeelist li {border-bottom: 1px solid #A6A5A5; padding: 8px 20px; background: #f8f8f8; -moz-transition: all .2s linear; position: relative;}
ul.employeelist li h4 {font-weight: 400; text-transform: none; margin: 12px 0px 0px}
ul#mainemployeelist li {background: #f8f8f8 url(/images/layout/icon.png) 6px center no-repeat; padding: 8px 20px 8px 26px;}
ul.employeelist li:first-child, ul.employeelist li.dlfirstlistitem {border-top: 1px solid #A6A5A5;}
ul.employeelist li:hover, ul.employeelist li:active {background: #eaebee;}
ul#mainemployeelist li:hover {background: #eaebee url(/images/layout/icon.png) 6px center no-repeat;}
ul.employeelist .latetotal {font-weight: 700; padding: 7px 11px 12px; display: block;}
.left h4 {margin: 6px 0px;}
.homeheadline h4 {font-family: 'Roboto', sans-serif; font-weight: 400; color: #014176; text-transform: none; line-height: 43px; margin: 6px 0px 6px 2px;}
.homeheadline .right a.button {margin: 10px 2px;}
h3.homemidtitle {margin-top: 20px;}

ul.employeelist li .latetooltip {display: none; position: absolute; background: #ffffff; padding: 8px; border: 1px solid #c5c9cf; -webkit-border-radius: 5px; border-radius: 5px; bottom: 29px; left: 15%; width: 70%;}
ul.employeelist li .right em {color: #A6A5A5;}
img.tooltiparrow {position: absolute; bottom: -12px; left: 46%;}
ul.employeelist li:hover .latetooltip {display: block;}
.latetooltip a.button { font-size: 12px; padding: 4px 11px;}
.latetooltip a.left {background: #F00F00;}
.latetooltip a.right:hover, .latetooltip a.left:hover {background: #364E61;}

ul.employeelist li a.buttongreen, ul.employeelist li a.buttonred {display: none;}
ul.employeelist li:hover a.buttongreen, ul.employeelist li:hover a.buttonred, ul.employeelist li:active a.buttongreen, ul.employeelist li:active a.buttonred {display: block;}
ul.employeelist a.buttongreen {position: absolute; right: 4px; top: 20px;height: 10px; width: 10px; display: block; border: 1px solid #0C3556; background: #11b100;line-height: 10px; font-size: 10px; text-align: center; color: #ffffff; -moz-transition: all .1s linear; opacity: 0.5;}
ul.employeelist a.buttonred {position: absolute; right: 4px; top: 4px; height: 10px; width: 10px; display: block; border: 1px solid #0C3556; background: #FF0000; line-height: 10px; font-size: 10px; text-align: center; color: #ffffff; -moz-transition: all .1s linear; opacity: 0.5;}
ul.employeelist a.buttonredel {top: 41%;}
ul.employeelist a.buttonred:hover {background: #4e2121;}
ul.employeelist a.buttongreen:hover {background: #34642f;}

p.updatemessage {color: #11b100 !important;}

ul.employeegoalslist {max-height: 250px; overflow: auto;}
ul.employeenoteslist {max-height: 400px; overflow: auto;}
ul.employeelatelist {max-height: 400px; overflow: auto;}

form h4 {margin-top: 8px;}

form#contact_form {padding: 20px; border: 1px solid #D3D5D9; background: #f8f8f8; border-radius: 5px 5px 5px 5px; width: 50%;}
form#contact_form input {width: 96%; padding: 2%; border: 1px solid #D3D5D9; border-radius: 5px 5px 5px 5px; font-family: Arial; font-size: 13px; color: 616161; margin: 4px 0px;}
form#contact_form textarea {width: 96%; padding: 2%; border: 1px solid #D3D5D9; border-radius: 5px 5px 5px 5px; font-family: Arial; font-size: 13px; color: 616161; margin: 4px 0px; resize: none; overflow: auto;}
form#contact_form p#pot {display: none;}
form#contact_form input[type=submit] {margin-bottom: 0px;
	background: #e9e9ea; /* Old browsers */
	background: -moz-linear-gradient(top,  #e9e9ea 0%, #d6d7da 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e9e9ea), color-stop(100%,#d6d7da)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #e9e9ea 0%,#d6d7da 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #e9e9ea 0%,#d6d7da 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #e9e9ea 0%,#d6d7da 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #e9e9ea 0%,#d6d7da 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e9e9ea', endColorstr='#d6d7da',GradientType=0 ); /* IE6-9 */
}
form#contact_form input[type=submit]:hover {cursor: pointer; opacity: 0.7;}

.right {float: right;}
.left {float: left;}


/*************
	FOOTER
*************/
.footer {min-height: 120px; padding-bottom: 8px; color: #ffffff; padding-top: 14px;}
.footer h4 {font-size: 14px; color: #ffffff;}


/******************************
		 Mobile Phone
******************************/


@media screen and (max-width: 960px) {
	.one_fourth {width: 50%;}
}

@media screen and (max-width: 768px) {
   .one_half, .one_fourth, .two_thirds, .one_third, .four_tenths, .six_tenths, .one_twelves, .one_sixth, .largeone_third, .smalltwo_thirds {width: 100%; float: none;}
	.m_l, .m_m, .m_r {margin: 10px 0px;} 
	a.logo, ul.mainnav, ul.mainnav li {float: none; }
	.mainnavcontainer {height: auto; text-align: center;}
	ul.mainnav li a {line-height: 40px;}
	ul.mainnav li:last-child a {background: #f2f3f3; color: #464646; margin: 0px; text-transform: uppercase; font-weight: 700;}
	ul.mainnav li:last-child a:hover {background: #ffffff;}
	.tealbg p {line-height: 36px; text-align: center;}
	.tealbg p a {float: none; display: block; margin-top: 12px;}
	.mobileshow {display: block;}
	.mobilehide {display: none !important;}
	.slidehold .slide1 h1 {font-size: 34px; padding: 34px 10px 0px;}
	.slidehold .slide1 h4 {font-size: 20px;}
	.slidehold .slide1 {height: auto; padding-bottom:34px; }
}

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