/* FLEX 1080 v2 Responsive Design, By: Michael Leon
/* RESET
----------------------------------------------------------*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, img, ins, q, small, strong, sub, sup, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { border:0; margin:0; padding:0; background:transparent; font-size:100%; }
article, aside, figure, figure img, figcaption, hgroup, footer, header, nav, section, video, object { display:block }
a img { border:0 }
body, li { line-height: 1; }
ol, ul { list-style:square; }
blockquote, q { quotes: none; margin:20px; }
/* FLEX
----------------------------------------------------------*/
.wrap div {
	display: block;
	float: left;
	text-align: center;
}
.wrap { width:1080px; padding-left: 20px; padding-right: 20px; margin: 0 auto; }
.section { width: 100%; *zoom: 1; height:auto; clear:both; position:relative }
.one, .two, .three, .four, .five, .six, .seven, .eight, .nine, .ten, .eleven, .twelve { padding: 10px; margin: 10px; word-wrap: break-word }
.one { width: 50px }
.two { width: 140px }
.three { width: 230px }
.four { width: 320px }
.five { width: 410px }
.six { width: 500px }
.seven { width: 590px }
.eight { width: 680px }
.nine { width: 770px }
.ten { width: 860px }
.eleven { width: 950px }
.twelve { width: 1040px }
.one-full { width: 90px }
.two-full { width: 180px }
.three-full { width: 270px }
.four-full { width: 360px }
.five-full { width: 450px }
.six-full { width: 540px }
.seven-full { width: 630px }
.eight-full { width: 720px }
.nine-full { width: 810px }
.ten-full { width: 900px }
.eleven-full { width: 990px }
.twelve-full { width: 1080px }
.offset-left { padding-left:0; margin-left:0 }
.offset-right { padding-right:0; margin-right:0 }
.offset-both { padding-right:0; padding-left:0; margin-right:0; margin-left:0 }
img { max-width: 100%; height: auto }
.clearfix,.clearboth  { clear: both !important; }
/* TYPE SETTINGS
----------------------------------------------------------*/
body { font-family: Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif; color: #FFF; font-size: 14px; line-height: 1.5em; margin: 0px; background-image: url(files/body/tile-sides.jpg); width:100%; background-position: center top; font-weight: normal; background-repeat: repeat; }
a { color: #999; font-weight:bold; text-decoration: none; transition: color 0.4s ease; -webkit-transition: color 0.4s ease; -moz-transition: color 0.4s ease; -o-transition: color 0.4s ease; }
a:hover { color:#777; }
p { margin-bottom:.5em; }
h1, h2, h3, h4, h5, h6 { line-height:1.5em; margin-bottom:0.2em; clear: both; }
h1, h1 a { font-size: 26px; font-weight: normal; color: #FFF; line-height: 1.2em; text-transform: uppercase; }
h2, h2 a { -moz-border-radius: 7px; -webkit-border-radius: 7px; border-radius: 7px; font-size: 24px; color: #666; font-weight: normal; line-height: 1.2em; padding-bottom: 3px; }
h3 { font-size: 14px; clear: both; margin-top: 30px; }
h4 { font-size: 16px; }
h5 { font-size: 14px; }
h6 { font-size: 14px; text-transform: uppercase; }
.font9 { font-size: 9px; }
.font10 { font-size: 10px; }
.font12 { font-size: 12px; }
.font14 { font-size: 14px; }
.font16 { font-size: 16px; }
.font18 { font-size: 18px; }
.font24 { font-size: 24px; }
.font30 { font-size: 30px; }
.highlight-color { color: #2349B5; }
.h1-subtitle { color: #333; font-size: 16px; font-style: italic; }
/* TOOLS
----------------------------------------------------------*/
.floatfix { float: none !important; }
.align-center, .aligncenter, .center { text-align:center; }
.align-left, .left { text-align:left; }
.align-right, .right { text-align:right; }
.float-img-right, .alignright { display:block; padding:10px; float:right; }
.float-img-left, .alignleft { display:left; padding:10px; float:left; }
img.align-center, img.aligncenter, img.center {display: block;clear: both;margin: inherit auto;}
.inline-img { display: inline; vertical-align: middle; margin-right: 3px; }
.img-vert-padding { padding-top: 10px; padding-bottom: 10px; }
#article-resource { font-size:75% }
.make-line { display:block; background-color:#000; height:10px; width:96%; margin-top:10px; margin-bottom:10px; padding-left:2%; padding-right:2%; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; clear: both; opacity: .1; }
.keyword-services { width: 30%; margin: 5px; padding: 5px 6px; }
.hide-from-mobile { }

/* HEADER 
----------------------------------------------------------*/
#header-background { background:url(files/body/tile-header.jpg) repeat-x; }
#header { line-height: 0px; }
#header img { width: auto; line-height: 0px; margin: 0px; padding: 0px; }
/* HIDE MOBILE HEADER 
----------------------------------------------------------*/
#mobile-header { left:-999em; position: absolute; }
#tablet-header { left:-999em; position: absolute; }
/* CONTENT  
----------------------------------------------------------*/
#body-wrap { }
#body-top { height: 10px; background:url(files/body/body-top.jpg); }
#body { background-repeat: repeat-y; background-color: #FFF; background-image:url(files/body/body.jpg); }
#body ul { margin: 0px; padding-left: 10px; list-style-type: none; }
#body ul li { padding-top: 7px; padding-bottom: 7px; background-image: none ; background-repeat: no-repeat; background-position: left 11px; padding-left: 15px; height: auto; line-height: 1.3em; }
#body ul.checkmarks li{ background-image: none ; background-repeat: no-repeat; background-position: left top; padding-left: 30px; font-size: 16px; line-height: 1em; }
#body-bottom { height: 20px; background:url(files/body/body-bottom.jpg); }
#content {
	float: right;
	text-align: center;
}
#body a img:hover    { opacity: .85; }
/* SIDEBAR
----------------------------------------------------------*/
#sidebar { }
#form { width: 300px; height: auto; padding-top: 60px; padding-right: 10px; padding-left: 10px; margin-bottom: 10px; background-image: url(files/sidebar/form.jpg); background-repeat: no-repeat; min-height: 50px; margin-top: 10px; }
div[id^="123 Contact Form"] { width: 100%; }

/* FOOTER
----------------------------------------------------------*/
#footer-wrap { background:url(files/body/tile-footer.jpg) repeat; border-top: none; width:100%; background-position: center top; font-weight: normal; background-repeat: repeat;}
#footer { color: #ededed; font-size: 12px; line-height: 1.3em; }
#footer p { margin: 0px; }
#footer a { color: #FFF; }
#footer strong { text-transform: uppercase; }
#footer h4 { font-size: 16px; color: #FFF; margin-top: 0px; margin-bottom: 5px; display: block; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; padding-top: 2px; padding-bottom: 2px; padding-left: 0px; }
#footer ul { margin: 0px; padding-left: 0px; list-style-type: none; }
#footer ul li a { text-decoration: none; color: #FFF; font-weight: normal; }
#footer ul li a:hover, #footer a:hover { color: #999; text-decoration: none; }
.social img { margin-top: 5px; margin-bottom: 7px; }
.no-underline { border-bottom-style: none !important; }
/* MENU
----------------------------------------------------------*/
.menu-top { height: auto; zoom:1; background-image: url(files/menu/menu.jpg); z-index: 2000; }
.menu-top ul, .menu-top li, .menu-top ul ul li { list-style:none; padding:0; margin:0; display:block; }
.menu-top ul li { float:left; position:relative; background-image: url(files/menu/divider.png); background-repeat: repeat-y; background-position: right center; z-index: 3000; }
.menu-top ul li a { display:block; font-weight: normal; color: #FFF; font-size: 20px; line-height: 60px; padding-right: 28px; padding-left: 28px; text-transform: uppercase; }
.menu-top ul li a:hover { background-image: url(files/menu/menu-highlight.png); background-repeat: repeat; }
.menu-top ul ul { position:absolute; top:-99999px; left:0; opacity: 0; -webkit-transition: opacity .5s ease-in-out; -moz-transition: opacity .5s ease-in-out; -o-transition: opacity .5s ease-in-out; transition: opacity .5s ease-in-out; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; z-index:9998; background:#000; padding: 5px; width:auto; }
.menu-top ul ul li { white-space:nowrap; float:none; position:relative; width:auto; margin-top:-15px; -moz-transition: margin 0.3s 0.1s ease-out; -webkit-transition:margin 0.3s 0.1s ease-out; -o-transition:margin 0.3s 0.1s ease-out; transition:margin 0.3s 0.1s ease-out; background-image: none; z-index: 4000; }
.menu-top ul ul li a { color: #fff; line-height: 28px; font-size: 14px; padding: 0px 15px; }
.menu-top ul ul li a:hover { color: #FFF; background-image: url(files/menu/menu-highlight.png); background-color: transparent; }
.menu-top ul li:hover > ul { opacity: .9; position:absolute; top:99%; left:0; }
.menu-top li:hover ul li { margin-top:0; }
.menu-top ul ul li:hover > ul { position:absolute; top:0; left:100%; opacity: .9; z-index:9999; background:#000; }
.menu-top ul ul ul { position:absolute; top:-99999px; left:75%; opacity: 0; -webkit-transition: opacity .5s ease-in-out, left .5s ease-in-out; -moz-transition: opacity .5s ease-in-out, left .5s ease-in-out; -o-transition: opacity .5s ease-in-out, left .5s ease-in-out; transition: opacity .5s ease-in-out, left .5s ease-in-out; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; width:auto; }
.menu-top .current-menu-item a, .menu-top .current_page_item a, .menu-top a:hover { color: #FFF; background-image: url(files/menu/menu-highlight.png); background-repeat: repeat-x; }
.menu-top ul li:last-child { background-image: none; }
.mobile-dropdown { display: none; }
/* SIDEBAR MENU
----------------------------------------------------------*/
.sidebar-menu { -moz-border-radius: 7px; -webkit-border-radius: 7px; border-radius: 7px; display: block; width: 100%; margin-top: 15px; margin-bottom: 15px; }
.sidebar-menu h4 { margin: 0px; line-height: 1em; font-size: 16px; color: #FFF; background: #333; text-transform: uppercase; font-weight: normal; padding: 7px 2%; width: 96%; }
.sidebar-menu ul, .sidebar-menu ul ul { list-style-type: none; padding:0px !important; margin:0px !important; width: 100%; }
.sidebar-menu ul li { font-size:16px; line-height: 1.2em; background-image: none !important; margin: 0px 0px 1px !important; width: 100%; padding: 0px !important; }
.sidebar-menu ul li a { font-size:16px; display: block; height: auto; color: #FFF; font-weight: normal; text-transform: uppercase; transition: background 0.4s ease; -webkit-transition: background 0.4s ease; -moz-transition: background 0.4s ease; -o-transition: background 0.4s ease; background-color: #444; margin: 0px; width: 96%; padding-top: 7px; padding-bottom: 7px; padding-left: 4%; }
.sidebar-menu ul li a:hover { color: #FFF; background-color: #666666; text-decoration:none; }
.sidebar-menu li a.active { }
.sidebar-menu ul li ul li a { background-color:#666 !important; color: #fff !important; }
.sidebar-menu ul li ul li a:hover { color: #FFF !important; background-color: #666666 !important; }
.sidebar-menu .first-item { -moz-border-radius: 7px 7px 0px 0px; -webkit-border-radius: 7px 7px 0px 0px; border-radius: 7px 7px 0px 0px; }
.sidebar-menu .last-item { -moz-border-radius: 0px 0px 7px 7px; -webkit-border-radius: 0px 0px 7px 7px; border-radius: 0px 0px 7px 7px; }
.dropdown { }
.active { }
/* CARD FLIPS - CJL
----------------------------------------------------------*/
#cards { z-index:998; background-color: #FFF; }
.card-flip-x, .card-flip-y, .card-flip-x .front, .card-flip-x .back, .card-flip-y .front, .card-flip-y .back { width:320px; height:150px; z-index:1000; } /* CHANGE DIMENSIONS HERE*/
.card-flip-x, .card-flip-y  { position: relative; -webkit-perspective: 1200px; -moz-perspective: 1200px; }
.card-flip-x .front, .card-flip-x .back, .card-flip-y .front, .card-flip-y .back  { float: none; position: absolute; top: 0; left: 0; -webkit-transform-style: preserve-3d; -webkit-backface-visibility: hidden; -moz-transform-style: preserve-3d; -moz-backface-visibility: hidden; -o-transition: all .4s ease-in-out; -ms-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; -webkit-transition: all .4s ease-in-out; transition: all .4s ease-in-out;  }
.card-flip-x .front p, .card-flip-y .front p { background-color:#000; background-color:#666666; color:#FFF; font-size:1.25em; position:absolute; bottom:15px;  font-weight:bold;  padding:5px 0; margin:0; text-align:center; width:100%;  text-transform:uppercase; z-index:402; }
.card-flip-x .front img, .card-flip-y .front img { position:absolute; z-index:401; width:100%; height:100%; top:0; left:0; }
.card-flip-x .back h2, .card-flip-x .back p, .card-flip-y .back h2, .card-flip-y .back p { padding:20px; color: #FFF; }
.card-flip-x .front, .card-flip-y .front { z-index: 400; -webkit-transform: rotateX(0deg) rotateY(0deg); -moz-transform: rotateX(0deg) rotateY(0deg); background-color:#444; } /* Front of Card - Background Color */
.card-flip-x:hover .front, .card-flip-y:hover .front  { z-index: 400; } /* Front of Card - Background Color DURING TRANSITION */ 
.card-flip-x:hover .back, .card-flip-y:hover .back { z-index: 500; } /* Back of Card - Background Color */
.card-flip-x:hover .front  { -webkit-transform: rotateX(180deg); -moz-transform: rotateX(180deg); }
.card-flip-x .back { -webkit-transform: rotateX(-180deg); -moz-transform: rotateX(-180deg); overflow:hidden; }
.card-flip-y:hover .front  { -webkit-transform: rotateY(180deg); -moz-transform: rotateY(180deg); }
.card-flip-y .back { -webkit-transform: rotateY(-180deg); -moz-transform: rotateY(-180deg); overflow:hidden; }
.card-flip-x:hover .back, .card-flip-y:hover .back {-webkit-transform: rotateX(0deg) rotateY(0deg); -moz-transform: rotateX(0deg) rotateY(0deg); }
/* Image Rollover
----------------------------------------------------------*/
.imageRoll { height: 145px; padding-top: 10px; }
.imageRoll a { display:block; width: 180px; background-position: left top; line-height: 0px; margin: 0px; padding: 3px 0px 0px; float: left; height: 142px; font-size: 2px; color: #FFF; text-align: center; -webkit-transition: background .2s ease-in-out; -moz-transition: background .2s ease-in-out; -o-transition: background .2s ease-in-out; transition: background .2s ease-in-out; }
.imageRoll a:hover { background-position: left bottom; color: #666666; }
.s1 { background-image: url(); background-repeat: no-repeat; }
/* Banner Scroller
----------------------------------------------------------*/
.scrollLeftBanner { position: relative; overflow: hidden; width: 1080px; height: 425px; z-index:101; line-height: 0px; }
.scrollLeftBanner p { line-height: 0px; margin: 0px; padding: 0px; display:block; height: 425px; width:1080px; overflow: hidden; position: absolute; }
/* Banner Fade
----------------------------------------------------------*/
.banner { position:relative; height:425px; width: 1080px; overflow: hidden; clear: left; }
.banner a, .banner img { display:block; margin: 0px; line-height: 0px; height: 425px; width: 1080px; position: absolute; left: 0px; top: 0px; }
/* Banner Deluxe
----------------------------------------------------------*/
.banner-deluxe { position:relative; height:425px; width: 1080px; overflow: hidden; clear: left; }
.banner-deluxe .deluxe-slide { display:block; margin: 0px; height: 425px; width: 1080px; position: absolute; left: 0px; top: 0px; }
.banner-deluxe .slide-1 { background-image: url(files/home/home-1.jpg); }
.deluxe-slide .banner-overlay { background-image: none; background-repeat: repeat; height: 120px; position: absolute; top: 40px; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; width: 360px; right: 40px; padding: 20px; color: #FFF; }
.banner-deluxe h2, .banner-deluxe h2 a { color: #FFF; }

/* PopUp Window
----------------------------------------------------------*/
#popupblock h1 { color: #666666; font-size: 30px; background: url(none); border-style: none; margin-bottom: 20px; }
#popupblock h2 { color: #666666; font-size: 18px; background: url(none); padding-bottom: 5px; border-bottom-width: 1px; border-bottom-style: dashed; border-bottom-color: #999; margin-bottom: 20px; border-top-width: 0px; border-right-width: 0px; border-left-width: 0px; }
#popupblock a { display: block; height: auto; width: 96%; font-size: 16px; color: #FFF; clear: both; text-align: center; text-transform: uppercase; line-height: 1.5em; transition: background 0.4s ease; -webkit-transition: background 0.4s ease; -moz-transition: background 0.4s ease; -o-transition: background 0.4s ease; font-weight: normal; margin-right: 2%; margin-left: 2%; padding-top: 5px; padding-bottom: 5px; margin-top: 20px; background-color: #666666; -moz-border-radius: 7px; -webkit-border-radius: 7px; border-radius: 7px; }
#popupblock a:hover { color: #FFF; background-color: #333; }
#fade { display: none; background: #000; position:fixed; left:0; top:0; z-index: 4000; width: 100%; height: 100%; opacity: .85; }
#popupblock { display: none; position: fixed; left:25%; padding: 2%; border: 15px solid #ddd; font-size: 16px; margin-left:auto; margin-right:auto; opacity:1; filter:alpha(opacity=100); width:46%; height:auto; z-index: 99999; -moz-border-radius: 7px; -webkit-border-radius: 7px; border-radius: 7px; background-color: #fff; background-image: none; background-repeat: no-repeat; background-position: center bottom; overflow: auto; }
.close { text-decoration:none; }
#footer-wrap #footer .four {
}
#footer-wrap #footer .four {
}
#footer-wrap #footer .four {
}




/* MOBILE FLEX
----------------------------------------------------------*/
@media handheld, only screen and (min-width: 601px) {
}
@media handheld, only screen and (max-width: 600px) {
.wrap { width: 100%; margin:0; padding:0; position:relative }
#body, #footer { width: 96%; padding-right: 2%; padding-left: 2%; background-color: #000; background-image: none; -moz-border-radius: 7px; -webkit-border-radius: 7px; border-radius: 7px; margin-top: 10px; margin-bottom: 10px; }
.section ul { width: 96% !important; }
.one, .two { width: 46%; margin: 10px 1% 0px !important; padding:5px 1%!important; float: left; }
.three, .four, .five, .six, .seven, .eight, .nine, .ten, .eleven, .twelve, .keyword-services { float: none; margin: 5px 0px !important; padding:5px 0px!important; width: 100%; clear:both;}
.offset-left, .offset-right, .offset-both { width: 100%; margin:5px 0px !important; padding:0px !important; }
#header-background { background:none; }
#mobile-header:after { clear: both; }
#mobile-header { position:static !important; padding-top:60px !important; width:100%; }
#mobile-header p { width:100%; text-align:center; clear:both; padding:0px; margin:0px; line-height:0; }
#sidebar img, #content img { padding:5px 0px; }
#footer, #footer-wrap { background-image: none; background-color: #000; }
#footer h4 { }
#footer a { }
.menu-top p.mobile-dropdown { color:#fff; display: block !important; background-color: #000 !important; text-align: center; width: 100% !important; margin:0 0 10 !important; padding:0 !important; line-height: 40px !important; cursor: pointer; background-image: url(files/mobile/menu-view.png); background-repeat: no-repeat; background-position: right center; }
.menu-top { width: 100% !important; position: absolute !important; left: 0; overflow: hidden; line-height: 34px; top: 0px; height:40px; }
.menu-top:hover { -webkit-transition: height .5s ease; -moz-transition: height .5s ease; -o-transition: height .5s ease; -ms-transition: height .5s ease; transition: height .5s ease; }
.menu-top { background: none !important; padding:0px !important; margin:0px; !important;
border:0; }
.menu-top ul, .menu-top ul li, .menu-top ul ul li { list-style:none; width:100% !important; }
.menu-top ul { opacity: .85; background-color: #000; }
.menu-top ul li, .menu-top ul ul li { float:none; position:static; background-image: none; margin:1px 0px !important; white-space:wrap; clear:both; }
.menu-top ul li a, .menu-top ul ul li a { display:block; font-weight: normal; color: #FFF; font-size: 16px; border-radius:0px; padding:0px !important; margin:0px !important; line-height: 40px !important; text-align:center; text-transform: uppercase; background-color:#222 !important; width:100% !important; }
.menu-top ul ul { position:static; top:0; left:0; opacity:1; padding:0px; -moz-transition:0 !important; -webkit-transition:0 !important; -o-transition:0 !important; transition:0 !important; -moz-border-radius: 0px; -webkit-border-radius: 0px; border-radius: 0px; background:transparent; width:100%; margin-top:1px; }
.menu-top ul li:hover > ul, .menu-top ul ul li:hover > ul { opacity: 1; position:static; top:0; left:0; }
.menu-top ul li a:hover, .menu-top ul ul li a:hover { color: #FFF !important; background-image: none; background-color:#666666 !important; }
.menu-top li:hover ul li { margin-top:0; }
.menu-top ul ul li, .menu-top ul ul ul li, .sidebar-menu ul ul { display:none !important; }
.menu-top .current-menu-item a, .menu-top .current_page_item a { color: #FFF; background-image: none; background-color:#666666; }
.menu-top li.show-mobile { display:block !important; }
.sidebar-menu ul li a { width:100% !important }
#content .float-img-left, #content .float-img-right { display:block; margin:0 auto; float:none; text-align:center; }
/* GALLERY
----------------------------------------------------------*/
#gallery ul li { padding: 5px 1% !important; width: 48% !important; padding-right:0 !important}
#gallery ul li a { margin: 0 !important; padding:0 !important}
/* Hide Elements From Mobile
----------------------------------------------------------*/
.hide-from-mobile { display:none !important; }
.hide-from-pc { display:inherit !important;}
}
/* Services Box
----------------------------------------------------------*/
.services { padding-top: 5px; width:100% }
.services img { float: left; display: left;  padding-right: 10px; }
