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

::-webkit-scrollbar{
	width:12px; max-width:12px !important; background:#ed6b21; background:rgba(255,255,255,.2);
}
::-webkit-scrollbar-track
{ background: rgba(0,0,0,1)
}
::-webkit-scrollbar-thumb
{ background: rgba(237, 107, 33, .8); border:2px solid rgb(255,255,255); border-right:0 !important
}
::-webkit-scrollbar-thumb:hover
{ background: rgb(237, 107, 33); border:2px solid rgb(255,255,255); border-right:0 !important
}
#ex3::-webkit-scrollbar-thumb:active
{ background-color:#ed6b21; border:1px solid rgba(250,225,0,.9);
}	

#pageShop #header {height: 135px !important;}
#pageShop #header #logo {padding: 0 0 0 7vw !important; max-width: 410px !important; margin: 0 auto; top: 0 !important; width: 100%; text-align: center;}


@media print {
	* {color:#000}
}

@media screen and (max-width:1600px) {
  #categoryListOpen li a div ul li {font-size: 14px}
  #categoryListOpen li:hover div {bottom: 3%; left: 3%; right: 3%;}
}

@media screen and (max-width:1500px) {
  #categoryListOpen li {width:32.6% !important; margin: 0.25vw}
  #categoryListOpen li:hover a div li {width:96% !important; font-size: 16px}

  #categoryListOpen li:nth-child(-n+2) {width:49.25% !important}
  #categoryListOpen li:nth-child(-n+2) a img {width:65%; float: left}
  #categoryListOpen li:nth-child(-n+2) a div {width:62%; left:32%; right: 3%; bottom: 28%; border:6px solid #6E9533; background: #FFF}
  #categoryListOpen li:nth-child(-n+2):hover a img {width:100%; filter: blur(3px) grayscale(100)}
  #categoryListOpen li:nth-child(-n+2):hover a div {width:86%; left:7%; right: 7%; bottom: auto; top:12%; background: inherit}
  #categoryListOpen li:nth-child(-n+2):hover a div span {font-size: 32px}
  #categoryListOpen li:nth-child(-n+2):hover a div li {width:96% !important; font-size: 16px}
  
  
  nav.isFixed .container {margin: 8px}
  nav.isFixed a.btn {margin: 0 6px 0 0 !important; padding: 6px 8px 7px 6px !important}
  nav.isFixed #singler {padding:0}
  nav.isFixed li a i, nav.isFixed a i {font-size: 15px}
}

@media screen and (max-width:1400px) {
  
  #header #logo {width:543px; padding: 0 0 0 2vw; top:0}
  /*#header #logo a img.icon {max-height: 170px; height: auto !important} */
  #header #contactbar {width:50vw}
  #header #contactbar p#headtext .morphext {font-size:38px}
  #pageHome #photoPanel {height: 78vh !important}
  #pageHome #photoPanel #bannerPhoto {filter:blur(1px); background-size: 123%}
  
  #youtubeBox {display:none !important}
  ul#properties {bottom: 210px;}
  
  #messagePanel {width:75%}
    
  
}

@media screen and (max-width:1320px) {
  #categoryListOpen li:hover a div {left:3%; right: 3%; bottom:5%}

  #categoryListOpen li a div span {font-size: 24px}
  #categoryListOpen li a div li {font-size: 14px}
  
}
@media screen and (max-width:1200px) {
  h1, h2, #mainBlock h1, #mainBlock h2 {font-size: 36px; line-height: 1.2em;}
  
  #header #logo a img.icon {height: auto; width: 100%}
  #header #contactbar {width:50%; padding: 2px 0 12px !important}
  #header #contactbar p#headtext, #header #contactbar p#headtext *, #header.smallheader #contactbar p#headtext a, #header #contactbar p#headtext .morphext {font-size:28px}
  #header #contactbar p#headtext {padding-bottom: 1px; margin: 0 0 4px}

  #messagePanel {position:relative; width:80%; text-align:center; z-index:360; padding:16px 0 12px; background:rgba(255,255,255,.6); top:-50%}
  #messagePanel p {margin: 12px 32px 0 !important}
  #pageHome #messagePanel {position: absolute; top:60%; width:86%; text-align:center; z-index:360; padding:12px 0 16px; background:rgba(255,255,255,0);}
  #photoPanel {height:40vh !important}
  #messagePanel p.subheading {display: none;}
  #messagePanel p.googleQuote {margin: 12px 32px}
  
  #header div > div {float:none; display:inline-block; clear:both; text-align:center;}
	#header #icon img.icon {height:85px !important}
	#header #iconname img.icon {height:auto !important; width:85%; display: block; margin: 0 auto;}
	
	#header .content {width:100vw; margin:0 auto; position:relative; padding: 0 !important; text-align: justify}
  #header #logo a {width:100%}

  #photoPanel {padding-bottom:0}
  
  #info-strap #straptop h1 {color: #ed6b21 !important;}
  #info-strap #straptop p#mainHeadline {margin:0 0 5px}
  
  #youtubeBox {width: 90%; height: 234px; right: 0;  transform: translate(-5%, 20%);}
  #youtubeBox iframe {width:100%; height: 234px;}
  
  ul#properties {position: relative; bottom: 0; width: 100%; left: 0;}
  ul#properties li {width:calc(25% - 0px); border:0 #fff solid; border: none; margin: 0 !important}
  ul#properties li .block span.title, .owl-carousel .item .block span.title {font-size: 18px !important}
  
  nav.isFixed .container {margin: 8px 8px 0}
  nav.isFixed a.btn {margin-top: 0 !important; padding: 6px 6px 7px 6px !important; width: calc(50% - 21px)}
  nav.isFixed a.btn i {margin:10px; display:inline-block !important; font-size: 20px}
  nav.isFixed a.btn span {display:inline-block !important; vertical-align: top; padding-top: 12px }
  
  nav.isFixed a.btn.btn-call {display: none !important}
  nav.isFixed #singler {padding:0; width:100%}
  nav.isFixed #singler li {width:calc(33.3% - 4px);  margin: 0 0px 10px 0; padding: 5px 12px 0 12px !important;}
  nav.isFixed #singler li a {text-align: center; display: block; width: 100%; padding: 6px 0 !important}
  nav.isFixed #singler li a i, nav.isFixed #singler li a i {font-size: 32px; display: block; text-align: center; margin: 10px auto;}
  

    
}
@media screen and (max-width:1100px) {
  .mw90 {max-width:96% !important; }
  #topline li {width:32%}
  #header.smallheader #logo {position: relative !important; top:0px !important}
  #header #logo {width:40%; padding: 0 0 0 1vw; top:24px !important; }
  #header #logo a img.icon, #pageCms #header #logo a img#logoSlim {height: auto; width: 100%; min-width: 180px; max-width: 390px; margin-top: 10px}
  #header #contactbar {width:auto; margin-right: 1%}
  #header #contactbar p#headtext .morphext {font-size:24px}
  
  
  #pageHome #photoPanel {height: 80vh !important}
  #pageHome #photoPanel #bannerPhoto {filter:blur(0); background-size: cover; height: 80vh;}
  
  #categoryListOpen li {width:49.25% !important}
  #categoryListOpen li:hover a div {left:3%; right: 3%; bottom:auto; top:7% !important}

  #categoryListOpen li a div span {font-size: 20px !important}
  #categoryListOpen li a div li {font-size: 14px !important}
      
}


@media screen and (max-width:1024px) and (orientation:portrait) {
  #pageHome #photoPanel {height: 52vh !important}
  #messagePanel {top:-50% !important}
  
	#topline li {width:25%; font-size:14px}
	#topline li.dash {display:none}
  
  #logoGSV {max-width: 400px; width: 30%; float: left; margin: 10px 0 0 20px;}
  #messagePanel h1 {font-size: 60px; letter-spacing: 2px; display: inline-block; width: 60%; vertical-align: top; text-shadow: none; margin: 15px 0 0;}
  #messagePanel h1 span {font-size: 29px; margin: 0 0 2px; letter-spacing: 1px;}
  #basebase {background: radial-gradient(rgb(51, 51, 51), #111);}
  #messagePanel p#messageFootnotes, #messagePanel p#messageFootnotes * {font-size:16px}
}
@media screen and (max-width:1024px) and (orientation:landscape) {
  #pageHome #photoPanel, #pageHome #photoPanel #bannerPhoto {height: 70vh !important}
}

@media screen and (max-width:1024px) {
  #header #contactbar p#headtext, #header #contactbar p#headtext *, #header.smallheader #contactbar p#headtext a {font-size: 24px; text-align: center}
  
  #youtubeBox:hover {opacity: 1 !important}

  .contactContact, #contactInfo {width:auto !important; display: block; float: none !important; padding: 0 1%}
  #contactBlock {padding: 0 2% !important}
  #contactme #contactForm .row.row_submit input#frmSubmit {background: #ed6b21 !important; color: #FFF !important; font-size: 20px}
  
  #toTheTop {bottom: 1.5vw; right: 1.5vw; padding: 11px; border-radius: 100%; border-width: 2px;}
  #toTheTop i {font-size: 32px}
  
  #pjWrapper .pjBlPost .pjBlPostContent .pjBlPostTitle.pull-right, #pjWrapper .pjBlPost .pjBlPostContent .pjBlPostTitle.pull-right:hover {border-radius:12px !important; background: #6E9533; float: left !important; clear: both; padding: 0; margin: 0 0 6px 6px;}
  #pjWrapper .pjBlPost .pjBlPostContent .pjBlPostTitle.pull-right span {color:#FFF !important}
 
  #topline ul#headerLine li#headerSocials a span {display: none}
  
  #youtubeBox {transform: translate(-5%, -10%);}
  #youtubeBox {width: 45%; height: 180px;}
  #youtubeBox iframe {width: 100%; height: 180px;}
  
  #ticklist li {width:50%}
  
  #basebase #footerLogo p {font-size:18px}
}

@media screen and (max-width:1023px) {
  #pjWrapper .pjBlCommentsCounter, #pjWrapper .pjBlPost .pjBlPostContent .pjBlPostTitle .pjBlCommentsCounter {font-size: 14px; padding: 5px 16px 6px 16px}
  #pjWrapper .pjBlCommentsCounter, #pjWrapper .pjBlPost .pjBlPostContent .pjBlPostTitle .pjBlCommentsCounter {font-size: 14px; padding: 5px 16px 6px 16px}
  #pjWrapper .pjBlPost .pjBlPostContent .pjBlPostTitle .pjBlCommentsCounter {font-size: 14px !important}
  #messagePanel p#messageFootnotes, #messagePanel p#messageFootnotes * {font-size:16px}
  
  nav li a i, nav a i {font-size: 32px; display: block !important; text-align: center; margin: 10px auto;}


  #header #logo {width:40%; padding: 0 0 0 1vw; top:10px !important; }

  #header #contactbar a {margin: 0 10px 0 0; padding-top: 6px}
  #header #contactbar a i {font-size: 28px}
  
  
  #homeBlocks .homeBlock {width:60px}
  
  #homeBlocks .homeBlock ul li a { padding: 12px;}
  #homeBlocks .homeBlock ul li a i {font-size: 24px;}
  
  #homeBlocks .homeBlock.blockLeft span {left: -60px;}
  #homeBlocks .homeBlock.blockRight span {right: -60px;}
  
  
  nav.isFixed #singler li {width:calc(33.3% - 4px);  margin: 0 0px 10px 0}
  #ticklist li {width:100%}
  
}

@media screen and (max-width:900px) {
  #topLine {background: rgba(237, 107, 33, .5); height: 10px !important}
  
  #header, #header.subPage {top:0 !important}
  
  #header svg {display:none !important}
  
  #topline ul#headerLine {width:100% !important}
  #topline ul#headerLine li {display: none}
  #topline ul#headerLine li#toplinetext {display: block !important; text-align: center; width:100%; padding: 1px 0 3px}

  #header #logo {top: -22px !important;}
  #header #logo a img{}
  /*
  #header #logo a img#logoLogo {display: none !important}
  #header #logo a img#logoSlim {display:block !important}
*/
  #pageHome #photoPanel {height: 80vh !important; position: relative; top:0}



  
  #nav ul.navnav li:not(:last-child) {display: none !important}
  #nav ul.navnav li#openclose {float: right; text-align:center; display: block !important; font-size:48px; width:100% !important }

  #nav ul.navnav.responsive {position: relative; background: rgba(60,4,68,.9) repeat center center; background-image: url(../images/bg_header-text__EDIT.png); padding: 6px 0 12px 0}
  #nav ul.navnav.responsive li, #nav .content li.icon, * #nav ul li.icon {float: none !important; display: block !important; width:99% !important}
	
  #nav ul.navnav.responsive li a span {color:#FFF}
  #nav ul.navnav.responsive li:hover a span {color:#FAE100}
  #nav ul.navnav.responsive li a {display: block; text-align: left;}
	#nav ul.navnav.responsive li a img {display:none}
  
  #nav ul#menunav li * {color:#FFF}
	#nav ul#menunav li:hover * {color:#FAE100}
	#nav ul#menunav li img {display: none !important}

  #pageHome #nav .content {padding: 8px 0 0;}

    
  #messagePanel {top:-50%; width:100vw !important}
  #messagePanel h1, #photoPanel:hover #messagePanel h1 {font-size: 32px !important;}
  #messagePanel h1 span {font-size: 28px; margin: 0 0 2px}
  
  
  #header #contactbar a * {background: none !important}
  #header #contactbar a {display: inline-block !important; background: #FFF !important}
  #header #contactbar a i {font-size:21px; color:#ed6b21 !important}
  #header #contactbar a span {display: none !important}

  nav li a span {font-size: 12px !important}
  #photos a {width:calc(97.2% / 5)}
  
  #pageHome #photoPanel {height: 60vh !important;}
  ul#properties li {width: calc(50% - 0px);}
  
  #info-strap #straptop a#ctaShop {max-width: 400px; width:80%; min-width: auto; padding: 20px 15px; border-radius: 20px; background: rgb(235 107 51) !important}
  #info-strap #straptop a#ctaShop i {font-size: 32px !important; color: #000 !important; padding-bottom: 8px;}
  #info-strap #straptop a#ctaShop span {font-size: 28px !important; color:#000 !important}
  
}

@media screen and (max-width:850px) and (orientation:landscape) {
  #header {background: rgba(255,255,255,.2)}
  #header, #header.subPage {top:10px !important}
  #header #contactbar {padding: 0 0 8px}
  #messagePanel p.subheading {font-size: 28px}
}


@media screen and (max-width:850px) {
  #messagePanel {top:-50% !important}
	#topline li {width:33%; font-size:14px}
	#topline li.dash {display:none}
  
  #logoGSV {max-width: 400px; width: 30%; float: left; margin: 10px 0 0 20px;}
  #messagePanel h1 {font-size: 60px; letter-spacing: 2px; display: inline-block; width: 60%; vertical-align: top; text-shadow: none; margin: 15px 0 0;}
  #messagePanel h1 span {font-size: 29px; margin: 0 0 2px; letter-spacing: 1px;}
  
  .skdslider ul.slides li img {animation: none !important}
  
}

@media screen and (max-width:850px) and (orientation:landscape) {
/*  #header, #header.subPage {position: relative !important} */
}

@media screen and (max-width:768px) {
  #categoryListOpen li, #categoryListOpen li:nth-child(-n+2) {width: 100% !important; margin: 0 0 1vw;}
  #categoryListOpen li a img {width:100% !important; height: 32vw !important; float:left}
  #categoryListOpen li a div:before {height: 1%}
  
  #categoryListOpen li a div, #categoryListOpen li:nth-child(-n+2) a div {left:auto !important; right: 3.25% !important; bottom:auto !important; top:9% !important; width: 64vw !important; background: #FFF !important;}
  
  #categoryListOpen li:hover div * {color:#6E9533 !important}

  #categoryListOpen li a div span {font-size: 22px !important}
  #categoryListOpen li a div .extras {display: block !important}
  #categoryListOpen li a div li {font-size: 14px !important}  
  
  #basebase #footerReviews, #basebase #footerLogo {width:90%; margin: 0 auto; display: block}
  #basebase #footerLogo {margin: 25px auto 0; width:100%; max-width:280px; }
  #basebase #footerLogo img {max-width:100%}
  
  #highlights li {display: block !important; margin: 4px 0 !important; text-align: left}
  
  #distributorsgrid.gridblock .griditem {width: 25% !important; padding: 0 !important;}

  
  #pageHome #photoPanel, #pageHome #photoPanel #bannerPhoto {height: 50vh !important;}
  .skdslider {height: calc(50vh - 110px) !important}

  #youtubeBox {width: 98%; height: 150px; position: relative; transform: none !important; top:0}
  #youtubeBox iframe {width: 100%; height: 100%;}
  
  

}

@media screen and (max-width:750px){
  a.btn-call {display: inline-block !important}
}

@media screen and (max-width:500px) and (orientation:portrait) {
  #pageHome #header {position: fixed !important; background: none}
  
  #info-strap #straptop h2 {font-size:24px !important}
  #info-strap #straptop p, #info-strap #straptop p * {font-size: 16px !important; color:#FFF !important}

  #header #logo {width:90%; }
  #header, #header.subPage {top:0 !important}
  #header #contactbar {width:100% !important; margin: 0 !important; display: none !important}
  #header.smallheader {background: rgba(255, 255, 255, 0.72) !important}
  
  #header.smallheader #logo {width:50% !important;}
  #header.smallheader #contactbar {width:30% !important; position: absolute !important; right: 0;}
  
  nav.isFixed .container {margin: 2px 0px 0;}
      
  nav.isFixed #singler li {width: calc(31.3% - 4px); padding: 5px 4px 0 4px !important;}
  

  #pageCms #header #contactbar {width:40px !important; opacity: 1; padding: 0; display: none !important}
  #pageCms #header #contactbar a {padding: 3px; margin: 3px; background: rgba(255, 255, 255, 0.75) !important}
  #pageCms #header #contactbar a i {display: block}

  
  #pageHome #messagePanel {top: -30% !important; width: 90%;}
  #youtubeBox {display:none}
  #messagePanel p.subheading {font-size: 26px !important; line-height: 1.36em; letter-spacing: 0;}
  
  #messageButtons {margin: 4px 0 2px 0;}
  #messageButtons a {font-size: 18px !important; display: inline-block; margin: 4px; padding: 4px 15px 5px 15px !important}

  #pageHome #photoPanel, #pageHome #photoPanel #bannerPhoto {height:35vh !important; margin-top: 0}
  #pageHome #messagePanel {top:-30% !important; width:90%; position: relative}
  #messagePanel p {margin: 0 12px !important}
  #messagePanel p.googleQuote, #messagePanel p.googleQuote * {text-align: justify; font-size: 14px !important}
  
  #messagePanel p.subheading {margin: 8px 32px 5px 32px; color: #6E9533 !important; font-size: 24px !important;}
  
  #messagePanel p#messageFootnotes, #messagePanel p#messageFootnotes * {font-size: 12px !important; width: 80%; margin: 0 auto !important;}
  
  #mainHeadline, #mainHeadline * {font-size: 42px !important}
  #mainHeadline span { font-style: italic; color:rgb(25,25,25) !important}
  #info-strap #straptop {padding: 12px 10px 2px 10px}
  
  #header.smallheader #contactbar {padding: 6px 0 10px 0 !important; display: block; float: none !important; width: 100%; text-align: center}
  #header #contactbar a {display: none !important; background: rgba(0, 0, 0, 0.7) !important; margin: 0 6px !important;}
  #header #contactbar a.btn-call, a.btn-call {display:inline-block !important}
  #header #logo a img.icon {width: 96%; min-width: 260px; margin: 0 auto; max-width: 290px;}

  .owl-carousel .item .block, ul#properties li .block {width:80%}
  ul#properties li .block span.title {font-size: 14px !important;}

  ul#properties li {width:50%; border-width:0 0 10px !important}
  
  
  #contactBlock #contactForm .row.col2 {width: calc(50% - 12px) !important;}
  #contactBlock #contactForm .row.col2.col1 input {width:86% !important}
  #contactBlock #contactForm .row.col2.col1.colMobFull input {width:93% !important}
  
  #contactBlock #contactForm .row *.txt, #contactme #contactForm .row textarea {padding:10px 10px 7px 10px}
  
  #contactBlock #contactForm .row.colMobFull {width: 100% !important}
  #contactBlock #contactForm .row.col2.col1.colMobFull input #contactBlock #contactForm .row.colMobFull input, #contactBlock #contactForm .row.colMobFull .txt {width: 93% !important}

  #distributorsgrid.gridblock .griditem {width: 50% !important; padding: 0 !important;}
  
  #toTheTop i {font-size: 24px}
  
  
}
@media screen and (max-width:420px) {
  #header #logo, #header #contactbar {display: block !important; position: relative !important}
  #header #logo {top: 0 !important; width: auto !important;}
  #header #logo img {max-width: 200px; width: 90%; margin: 0 auto }
  
  #header #contactbar {position: relative!important; top:0; right: 4px; text-align: center}
  #header #contactbar a i {font-size:24px !important}

  #header #contactbar p#headtext, #header #contactbar p#headtext *, #header.smallheader #contactbar p#headtext a {font-size: 22px; text-align: center}

  #header.smallheader #logo {}
  
  #categoryPhotos a:nth-of-type(1n+3){display: none !important;}
  
  .skdslider .slide-inner > h2 {font-size: 14px; }
  
  #singler {width:100%; padding: 20px 0 0px !important}
  #singler li {width:calc(33.3% - 4px) !important; text-align: center; margin: 0 1px 0 0 !important}
  #singler a:link, #singler a:visited, #singler a:active, #singler a:focus, #singler a:hover, nav a.btn {margin: 2px 0 !important; padding: 4px 0; width:100%}
  
  nav a.btn, nav.isFixed a.btn {display: inline-block !important; vertical-align: top; margin: 0 0 5px !important; float: none !important; padding: 0 0 0 9px !important; width: calc(50% - 12px) !important; }
  nav a.btn.navAllProps {display: block !important; margin-top: 8px; float: none !important; padding: 0px 2px 0 7px !important; width: auto !important; }
  
  nav.isFixed a.btn.btn-call {display: inline-block !important}
  nav li a i, nav a i {display:inline-block !important; font-size:25px}
  nav a.btn i {font-size: 16px !important}
  nav li a span {display: none !important}
  nav a.btn span, nav.isFixed a.btn span {vertical-align: top; margin: 10px 6px 0 10px; display: inline-block; padding: 0}
  ul#popupProps li {width: calc(100% - 10px)}
  ul#popupProps li .block {margin: 14% 0 0}
  ul#popupProps li a img {height:16vh}
  
  #photos a {width: calc(33.3% - 2px);}
  .fancybox-caption {padding: 5px 0 !important}

  ul#pjScProducts li.pjScProduct {width:50% !important}
}









@media screen and (max-width: 1200px) {
pre {display:none;}

	#header {padding-top:0}

	
	#header #contact {width:100%; padding:10px 0}
	#header #contact * {text-align:center; font-size:18px; padding-top:0 !important}
	#header #contact a {overflow:hidden; width:30%; display:inline-block;}
	#header #contact a span.label {display:none}
	#header #contact a span.data {display:block; width:100% !important}
	#header #contact a.contactAddr span {font-size:16px}
	#header #facebookLink {width:12%; position:absolute; top:0; right:0; min-width:48px; max-width:132px}

  
  

  .skdslider .slide-desc {bottom:0 !important}
  .skdslider .slide-desc > h2 {font-size:32px}
  .skdslider .slide-desc > p {font-size: 16px; line-height: 1.4em; width:90%; display: block; margin: 0 auto}

  
  .content {width:96%;}
	#nav .content {width:100%; padding-top:0 !important}
	#nav .content li.icon {width:20% !important; margin-top:0}
	#nav .content li.link {width:33% !important; padding:6px 0 0 !important}

	#nav .content li.icon a img {height:64px !important}

	#nav ul#menunav li {margin: 4px 0 !important; padding: 15px 0}
	#nav ul#menunav li * {text-align: center !important}
  
  #nav ul#menunav:hover li {}
  #nav ul#menunav li:hover {}
  
  
  #pageHome #nav ul li.icon span {padding:0}
	
  
	#contact_form {float:none; display:block; width:auto; margin-right: 0; margin-bottom:12px; padding:3px 3px 10px 6px; background:rgba(0,173,236,.3)}
	#contact_form div {display:inline-block; width:49%; margin:0; padding:0;}
	#contact_form div label {display:block; color:#000; font-size:14px; line-height:1em; width:100%; padding:8px 0 0;}
	#contact_form form input, #contact_form form select, #contact_form form textarea {width:95%; padding:3px 5px; display:block; margin:0 auto; background:rgba(255,255,255,0.85)}
	#contact_form form select {width:97%}
	#contact_form div.message {width: 98%}
	#contact_form div.message textarea {width:97%}
	#contact_form div.submit {width: 98%}
	#contact_form div.submit textarea {width:97%}
	#gmap_canvas {display:block; width:100%; height:320px;}

}

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

	#serviceTypes li {width:33%}
	h1, #messagePanel h1 {font-size:32px;}
	h2, h2 i {text-align: center !important}
  h2 {font-size:24px !important}
  
	#main .content {padding:3px 4px; width:auto}
	
	#nav .content li.link {width:50% !important; padding-top:4px !important}
	
	
	#header #contact a {width:49%}
	#header #contact a {font-size:24px}
	#header #contact a.contactAddr {width:100%}
  

  body#pageHome #photoPanel:hover #glassPanel {background:rgba(60,4,68,.2)}
  body#pageHome #photoPanel:hover .skdslider ul.slides li img {filter: blur(0) !important}
  


    
}
@media screen and (max-width: 825px){
  .skdslider .slide-desc p {display:none}
  .skdslider .slide-desc p.islinks {display: block !important}

}
@media screen and (max-width: 768px){
	#serviceTypes li {width:33%}
	#header #contact {padding:10px 0 0}
	
	#messagePanel {top:18%}
	#messagePanel *, #messagePanel:hover * {font-size:22px !important}

}
@media screen and (max-width: 700px){
	#topline {display:none}

	#main {padding:0}
	#pagehome #main {padding:5px 0 15px}
  #quotebutton {float:none; display:block; margin:2px auto 6px; text-align:center; padding:8px 0 1px; font-size:14px}
}
@media screen and (max-width: 600px) {
	#topline li {width:50%}
  .content {width:94%;}
	#header #contact a {width:100%}
	#header #contact a * {font-size:18px; letter-spacing:1px}

	#header #contact a.contactAddr {display:none}
  
	#messagePanel {top:-20% !important; background: none !important}
	body#pageHome #messagePanel {top:6%}
	#messagePanel *, #messagePanel:hover * {font-size:16px !important; text-shadow: none !important;}
	#messagePanel h1, #messagePanel:hover h1 {font-size:24px !important; color:#FFF !important; text-shadow: none !important}
  #messagePanel p * {color: #6e9533; }

  #nav .content li:first-child.icon a img {display:none !important}
	#nav .content li.icon {width:50% !important; margin-top:0; padding-top:0}
	#nav .content li.link {width:50% !important; padding:8px 0 0 !important}

	#nav .content li.icon a {position:relative; text-align: center}
	#nav .content li.icon a span {font-size:16px !important; width:100%; font-weight:bold}
	#nav .content li.icon a img {height:48px !important; opacity:.1}
  
  #nav .content li a {text-align: center !important}

	
	#quotebuttonBottom {width:90%; max-width:275px}
	
	#serviceTypes li {width:48%; padding-left:7px}
}
@media screen and (max-width: 480px){
  #contact_form div {display:block; width:99%}
	#nav .content li.link {width:100% !important; padding:8px 0 0 !important}

}