/* (C) Copyright 2006-2009 Long2 Consulting. All Rights Reserved */
/* Start Layout CSS. This top section of CSS is what is used to layout each of the pages. To change general styles, look for the Start General Styles section below. We strongly urge you not to change the Layout styles unless you have an advanced knowledge of CSS. We cannot help you if you mess it up. */

html {
}

body {
    margin: 0px;
    padding: 0px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-family: Roboto,sans-serif;
    line-height: 1.5em;
    -webkit-font-smoothing: antialiased;
    font-size: 18px;
    color: #000000;
    background-color: #c9c9c9;
    background: url("../images/bgn4.png") no-repeat;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center;
}

.btn-email {
    text-decoration: none;
    background: #333;
    padding: 5px 12px;
    color: #fff !important;
}

#wrapper {
	margin: 0px auto; /* fix to center in firefox */
	width: 100%;
    /*opacity: .9;*/
}

#innerwrapper {
	margin: 0px auto; /* fix to center in firefox */
}

#header {
	text-align: center;
	margin: 0px auto; /* fix to center in firefox */
	background-color: #eee;
}

#headerleft {
	float: left;
}

.header-wrapper {
    display: block;
    font-family: Garamond;
    width: 100%;
    font-size: 21px;
    text-transform: uppercase;
    color: maroon;
    padding: 0px 0px 8px 0px;
}

.headerleftcontent {
}

/* This is the company name area */

.companyname {
    padding: 10px 0px 0px 0px;
    font-weight: bold;
    color: maroon;
    text-align: center;
    font-size: 30pt;
    font-family: "Trebuchet MS", Verdana, Arial, sans-serif;
    text-transform: uppercase;
    /*border-bottom: 3px solid maroon;*/
}

.tagline {
	padding: 3px 0px 0px 60px;
	color: #888888;
	text-align: left;
	font-size: 16pt;
	font-family: "Trebuchet MS", Verdana, Arial, sans-serif;
	font-style: oblique;
	font-weight: bold;
}

.logo {
	float: left;
	margin-left: 8px;
	margin-right: 8px;
}


/* Picture Rotator */

#rotator {
    width: 100%;
}

#mainpic {
    overflow: hidden;
    height:  210px;
    z-index: 0;
}

.pics {
    height:  200px;
    padding: 0;
    margin:  0;
}

.pics img {
    height:  100%;
    width: 100%;
    top:  0;
    left: 0;
}

/* This is the horizontal top navigation bar */
#topnav {
    margin: 0px auto; /* fix to center in firefox */
    display: inline-block;
    /*margin-bottom:45px;*/
    width: 100%;
    opacity: .9;
    z-index: 1;
}

.topnavlinks {
	padding: 10px 0px;
	text-align: center;
	font-weight: bold;
    background: #333;
    border-bottom: 3px solid maroon;
    border-top: 3px solid #eee;
    width:100%;
    /*position:fixed;
    top: 0;*/
    z-index:10;
}

    .topnavlinks a:link, .topnavlinks a:visited {
        padding: 3px 9px;
        color: #ffffff;
        text-decoration: none;
        font-size: 16px;
        font-weight: 300;
        letter-spacing: .25px;
    }

.topnavlinks a:active, .topnavlinks a:hover {
	color: #ffffff;
	text-decoration: underline;
}

/* stop navigation */
.dropbtn-new {
    color: white;
    padding: 6px 16px;
    font-size: 16px;
    border: none;
    margin-bottom: 3px;
}

.dropdownnew {
    position: relative;
    display: inline-block;
}

.dropdown-new-content {
    display: none;
    position: absolute;
    background-color: #333;
    min-width: 160px;
    z-index: 1;
    text-align: left;
}

    .dropdown-new-content a:link {
        color: #eee;
        padding: 12px 16px;
        text-decoration: none;
        display: block;
    }

    .dropdown-new-content a:hover {
        background-color: #808080;
        color: #fff;
    }

.dropdownnew:hover .dropdown-new-content {
    display: block;
}

.dropdownnew:hover .dropbtn-new {
    background-color: maroon;
    color: #eee;
}

a.dropbtn-new:hover {
    text-decoration: none;
}

.sticky {
    position: fixed;
    top: 0;
    width: 100%;
}

/* This is the footer area */

#footerwrapper {
	width: 100%;
    padding: 16px 0px;
}

#footer {
	clear: both;
	margin: 0px auto; /* fix to center in firefox */
	width: 100%;
}

#footer2 {
    clear: both;
    margin: 0px auto; /* fix to center in firefox */
    width: 100%;
}


.footercontent {
	color: #888888;
	text-decoration: none;
	font-weight: bold;
	text-align: center;
    font-size: 12px;
}

.footercontent a:link, .footercontent a:visited  {
	padding: 4px 4px;
	color: #000000;
	text-decoration: underline;
}

.footercontent a:active, .footercontent a:hover {
	padding: 4px 4px;
	color: #7a0000;
}


/* Used in single column layouts */

/*#bodywrapper {
	width: 1000px;
}*/

#bodycolumn {
	clear: both;
	width: 1000px;
	min-height: 400px;
	background-position: top left;
	}

.bodycolumncontent {
	padding: 20px 30px;
}

/* Used in two column layout with left navigation */
#bodywrapper2 {
    padding: 20px 12px 20px 12px;
}
#bodycolumn2 {
	clear: both;
	background-position: top left;
    max-width:1120px;
    margin: 0 auto;
	}

/*#body1 {
	float: right;
}*/

#body2 {
	float: left;
}

.body1content {
	/*padding: 20px 30px 20px 0px;*/
}

.body2content  {
	padding: 20px 0px 20px 20px;
}


/* Used in three column layouts */
#body1b {
	max-width: 880px;
    min-width: 74%;
	float: left;
}

/*#body1c {
	width: 545px;
	float: right;
}*/

/*#body2b {
	width: 200px;
	float: left;
}*/
div.div-case {
    background: #eee;
    margin-top: 21px;
}
div.div-job {
    border: 1px solid #ddd;
    padding: 8px 12px;
    background: #fff;
    margin: 0px 0px 21px 0px;
    opacity: .9;
}

h1.home-h1 {
    word-spacing: 12px;
    letter-spacing: 3px;
    text-align: center;
    border: none !important;
    text-shadow: 2px 2px #ddd;
    font-size:32px;
}

.margin-12 {
    margin-bottom: 12px;
}
div.div-home-block {
    background: #eee;
    padding: 24px 16px;
    opacity: .9;
    margin-bottom: 12px;
    box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.05), 0px 2px 3px 0px rgba(0,0,0,0.1);
}

    div.div-home-block.alt {
        background: #fff;
    }

span.home-span {
    font-size: 21px;
    color: #333;
    text-align: left;
    font-family: "Trebuchet MS", Verdana, Arial, sans-serif;
    margin: 4px 0;
    text-transform: uppercase;
    margin-bottom: 18px;
    border-bottom: 3px solid maroon;
    text-align: center;
    padding: 0px 12px 12px 12px;
    display: inline-block;
}

ul.ul-disc
{
    list-style-type: disc;
}
ul.ul-square {
    list-style-type: square;
}
ul.ul-style-none {
    list-style-type: none !important;
}

p.para-email {
    text-align: left;
    padding: 12px 0px;
}

#body3 {
	max-width: 210px;
	display:inline-block;
	margin-left: 16px;
    font-size:14px;
}

.body1bcontent {
	padding: 20px 6px 20px 10px;
}

.body2bcontent {
	padding: 20px 0px 20px 20px;
}

.body3content {
	padding: 20px 30px 20px 0;
}


/* End of Layout CSS */


/*  The items below the properties for the links that appear in the
main text area as well as in the sidebar of the pages  */

a:link, a:visited {
	color: maroon;
}


a:active, a:hover {
	color: #333;
}

ul {
	/*list-style-image: url('../images/bullet.gif');*/
    list-style-type: none;
	padding: 0;
	margin: 0 0 20px 30px;
}

    ul.ul-services li {
        padding: 12px 0px;
    }

    ul.ul-services li:before {
        content: "\226B";
        font-weight: bold;
        font-size: 21px;
    }
    ul.ul-benefits {
        list-style-type: disc;
    }

    ol {
        padding: 0;
        margin: 0 0 20px 30px;
    }

p {
    padding: 3px 0;
    margin: 0;

}

.justify p, div.div-job p {
    text-align: justify;
}
div.div-job ul {
    list-style-type: square;
}

img {
	border: none;
    max-width: 100%;
}

/*  The items below set the properties for the fonts, sizes, and
colors used for headings 1 through 6. Typically h1 - h3 are used
in the main content area and h4 - h6 are used in the sidebar  */


h1 {
    font-size: 24px;
    color: maroon;
    font-size: 185%;
    text-align: left;
    border-bottom: 3px #000000 dotted;
    font-family: "Trebuchet MS", Verdana, Arial, sans-serif;
    margin: 8px 0;
    padding-bottom: 12px;
    text-transform: uppercase;
    line-height: 1.25;
}

h2 {
    font-size: 21px;
    color: #333;
    text-align: left;
    font-family: "Trebuchet MS", Verdana, Arial, sans-serif;
    margin: 4px 0;
}

h3 {
    font-size: 18px;
    color: #7a0000;
    text-align: left;
    font-family: "Trebuchet MS", Verdana, Arial, sans-serif;
    margin: 4px 0;
}

h4 {
    font-size: 16px;
    color: #7a0000;
    font-family: "Trebuchet MS", Verdana, Arial, sans-serif;
    margin: 4px 0;
}

h5 {
    font-size: 16px;
    color: #999;
    font-family: "Trebuchet MS", Verdana, Arial, sans-serif;
    margin: 4px 0;
}

h6 {
    font-size: 16px;
    color: #800000;
    font-family: "Trebuchet MS", Verdana, Arial, sans-serif;
    margin: 4px 0;
}

a.link-to-top {
    text-decoration: none;
    background: #eee;
    padding: 3px 6px 3px 3px;
}

.center {
    text-align: center;
}

/*  This class can be applied to your buttons to create uniform submit or shopping cart buttons without using graphics.  */
.caps {
    text-transform: uppercase;
}
.underline {
    text-decoration: underline;
}
.text-center{
    text-align: center;
}
.faq-qs {
    margin-bottom: 36px;
}

.submitbuttons {
    font-weight: bold;
    color: #7a0000;
    text-align: center;
    font-size: 100%;
    font-variant: small-caps;
    font-family: Verdana, Arial, sans-serif;
    border-top: 3px solid #7a0000;
    border-bottom: 4px solid #7a0000;
    border-left: 1px solid #7a0000;
    border-right: 1px solid #7a0000;
    background-color: #e2e2e2;
    width: 155px;
    height: 30px;
}

td {
	vertical-align: top;
}

table {
	border-collapse: collapse;
	font-size: 100%;
}

/*  The items below sets the properties for the left or right sidelinks.  */

.menuheader1 {
	width: 180px;
	background-color: #7a0000;
    text-align: left;
    padding: 4px;
	color: #ffffff;
}

.menuheader1 a:link, .menuheader1 a:visited {
	color: #ffffff;
	text-decoration: none;
	font-weight: bold;
}

.menuheader1 a:hover, .menuheader1 a:active {
	text-decoration: underline;
}

.sidelinks {
	margin: 4px 0px 2px 0px;
	padding: 0px;
	text-align: left;
	font-weight: bold;
}

.sidelinks a:link, .sidelinks a:visited {
	padding: 0px 10px 0px 10px;
	display: block;
	line-height: 18pt;
	width: 168px;
	color: #7a0000;

	text-decoration: none;
}

.sidelinks a:hover, .sidelinks a:active {
	color: #7a0000;
	background-color: #c8c8c8;
}


.clear {
	clear: both;
}

/*  The items below sets the properties for additional typography and page elements.  */

.block1 {
	color: maroon;
	text-align: left;
	font-family: Verdana, Arial, sans-serif;
	border-top: 1px solid maroon;
	border-bottom: 4px solid maroon;
	background-color: #e2e2e2;
	padding: 6px;
	margin-bottom: 8px;
}

.block2 {
	color: #ffffff;
	text-align: left;
	font-family: Verdana, Arial, sans-serif;
	border-top: 1px solid #7a0000;
	border-bottom: 4px solid #7a0000;
	background-color: #000000;
	padding: 6px;
	margin-bottom: 8px;
}

.block3 {
	color: #ffffff;
	text-align: left;
	font-family: Verdana, Arial, sans-serif;
	border-top: 1px solid #000000;
	border-bottom: 4px solid #000000;
	background-color: #7a0000;
	padding: 6px;
	margin-bottom: 8px;
}

.news1 {
	padding: 4px;
	display: block;
	color: #ffffff;
	background-color: #7a0000;
	border-bottom: 2px solid #000000;
	text-align: left;
    font-size: 14px;
}

.news2 {
    padding: 4px;
    display: block;
    color: #ffffff;
    background-color: #000000;
    border-bottom: 2px solid #7a0000;
    text-align: left;
    font-size: 14px;
}

blockquote {
	color: #ffffff;
	background-color: #7a0000;
	padding: 2px 12px;
	font-family: "Trebuchet MS", Verdana, Arial, sans-serif;
	font-size: 115%;
	font-style: italic;
	border: 2px solid #000000;
}


.tiny {
	font-size: 80%;
}

/*  Your smaller images can be floated to the left or the
right so your text can flow around them. You can also have
the images appear with or without a small border. The items
below sets the properties for the classes you may apply to
your images.  */

.image-border {
	border: 3px double #000000;
}

.imageleft-noborder {
	margin: 0 10px 0 0;
	float: left;
}

.imageright-noborder {
	margin: 0 0 0 10px;
	float: right;
}

.imageleft-border   {
	margin: 0 10px 0 0;
	float: left;
	border: 3px double #000000;
}

.imageright-border  {
	margin: 0 0 0 10px;
	float: right;
	border: 3px double #000000;
}
.opaque-bg {
    width: 100%;
    display: inline-block;
    background: #fff;
    opacity: .9;
}
.pad5
{
    padding: 5px;
}
@media only screen and (min-width: 6000px) {
    .g-maps {
        display: none;
    }
}