/*========== ValleyCashforCars.com nickswebworks nick sharpe  OG110416 updated 101117 ======== */
/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */
html {line-height: 1.15;-ms-text-size-adjust: 100%;-webkit-text-size-adjust: 100%;}
body {margin: 0;}
article,aside,footer,header,nav,section {display: block;}
h1 {font-size: 2em;margin: 0.67em 0;}
figcaption,figure,main {display: block;}
figure {margin: 1em 40px;}
hr {box-sizing: content-box;height: 0;overflow: visible;}
a {background-color: transparent;-webkit-text-decoration-skip: objects;}
b,strong {font-weight: inherit;}
b,strong {font-weight: bolder;}
small {font-size: 80%;}
/* Embedded content
   ========================================================================== */
audio,video {display: inline-block;}
audio:not([controls]) {display: none;height: 0;}
img {border-style: none;}
svg:not(:root) {overflow: hidden;}
button,input,optgroup,select,textarea {font-family: sans-serif;font-size: 100%;line-height: 1.15;margin: 0;}
button,input {overflow: visible;}
button,select {text-transform: none;}
button,html [type="button"],[type="reset"],[type="submit"] {-webkit-appearance: button;}
button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner {border-style: none;padding: 0;}
button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring {outline: 1px dotted ButtonText;}
fieldset {padding: 0.35em 0.75em 0.625em;}
legend {box-sizing: border-box;color: inherit;display: table;max-width: 100%;padding: 0;white-space: normal;}
progress {display: inline-block;vertical-align: baseline;}
textarea {overflow: auto;}
[type="checkbox"],[type="radio"] {box-sizing: border-box;padding: 0;}
[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button {height: auto;}
[type="search"]{-webkit-appearance: textfield;outline-offset: -2px;}
[type="search"]::-webkit-search-cancel-button,[type="search"]::-webkit-search-decoration {-webkit-appearance: none;}
::-webkit-file-upload-button {-webkit-appearance: button;font: inherit;}
details,menu {display: block;}
summary {display: list-item;}
/* Hidden
   ========================================================================== */
[hidden] {display: none;}

/*************************************************** END NORMALIZE  ************************************************/

/*** © 2016 NicksWebWorks.com - css by Nick Sharpe template 080713- updated 092817 *************/
html, body {height: 100%;width: 100%;margin: 0;padding: 0;font-family: Arial, Helvetica, Sanserif;color: #666;}
strong, th, h1,h2,h3,h4,h5,h6 {font-weight: bold;}
em{font-style:italic;font-weight:500;}
h1{font-size:200%;margin:0;padding:0px;}
h2{font-size:5vw;line-height: 2vh;}
/*h2{font-size:150%;font-family: Arial, helvetica, sans-serif;margin:0;}*//*#0071ef  blue color: #007D53; green*/
h3{font-size:112%;margin:10px 0;padding:0;font-weight:bold;}
h4{font-size:95%;margin:10px 0;padding:0;font-weight:bold;}
h4 em{font-style:oblique;}
.post-cnt p{margin: 10px 0;padding:0;}
.bold{font-weight:bold;}

@font-face {
    font-family: 'fonts/ronnia_basic_rgregular';
    src: url('fonts/ronniabasicreg-webfont.eot');
    src: url('fonts/ronniabasicreg-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/ronniabasicreg-webfont.woff') format('woff'),
         url('fonts/ronniabasicreg-webfont.ttf') format('truetype'),
         url('fonts/ronniabasicreg-webfont.svg#ronnia_basic_rgregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

/*************************** LAYOUT *********************************/

#shell{width: 100%;max-width: 1366px;height: 100%;margin: 0;padding: 0;}

header{position:relative;width:80%;height:12%;top:2%;margin:0 auto;padding:0;overflow: hidden;background:transparent url('images/San-Fernando-Valley-2-860.jpg') center 0%/cover no-repeat;
border-radius: 12px 12px 0 0;/*border: 1px dashed purple;*/}

/**** LOGO ****/
.logo{float: left;top:0;left:0;margin:0;padding:0;width:50%;height: 100%;background:transparent url('images/VC4C-logo-2.png') no-repeat center/contain;}
.logo h1{text-indent: -9999px;}
.companyname{font:bold 32px 'Open Sans', Arial, Helvetica, sans-serif;color: #00b52a;text-shadow: 1px 1px 2px #333;}

.phonebox{float: right;top:0px;right: 0px;width:30%;height:100%;margin:0;padding: 0;text-align: center;/*border: 2px dashed green;*/}
p.freequote{position: relative;top: 0;font: 900 1.1em/1em Arial, Helvetica, sans-serif;color: #fff;padding: 0 0 0px;text-align: center;}
p.freequote a {color: #00b52a;text-shadow: 1px 1px 1px #000;}
.toptel1{position: relative;top: 0;font-size: 1em;font-weight: 500;color: #00b52a;text-decoration: none;}
/*ul {list-style-type:none;}
ul.socials{position:relative;top:0px;left:0px;margin:0;padding:0;width:460px;height:40px;}
ul.socials li{display:inline;margin:0 10px 0 0;padding:0;width: 20px;}
ul.socials li a{float:left;text-decoration:none;margin:0 10px 0 0;padding:0;border: none;}
ul.socials li a:hover{color:orange;}*/


@import url(http://fonts.googleapis.com/css?family=Raleway);
 /* NAV STYLE */
nav#navigation {position: relative;top: 1%;right: 0;width: auto;max-width: 1366px;height: auto;margin: 0 auto;padding:0;font-weight: 700;text-align: right;background-color:transparent;box-shadow: none;/*border: 2px dotted green;*/}
/* RESPONSIVE NAV STYLE */
  /* Remove margins and padding from the list, and add a black background color */
ul.topnav {position: relative;left: 0;list-style-type: none;margin: 0 auto;padding: 0;width: 60%;max-width: 1366px;overflow: hidden;background-color:#00b52a;}

/* Float the list items side by side */
ul.topnav li {float: left;}

/* Style the links inside the list items */
ul.topnav li a {display: inline-block;color: #f2f2f2;text-align: center;padding: 10px 16px;text-decoration: none;transition: 0.3s;font-size: 90%;}

/* Change background color of links on hover */
ul.topnav li a:hover {background-color: #663399;}

/* Hide the list item that contains the link that should open and close the topnav on small screens */
ul.topnav li.icon {display: none;}

@media screen and (max-width:800px) {
  nav#navigation{position: relative;top: 0;left: 0;width: 90%;/*border: 1px dashed red;*/}
  ul.topnav {width: 100%;}
  ul.topnav li:not(:first-child) {display: none;}
  ul.topnav li.icon {float: right;display: inline-block;
  }
  ul.topnav li a {padding: 5px 16px;}
}

/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens */
@media screen and (max-width:800px) {
  ul.topnav.responsive {position: relative;left: 5%;width: 100%;}
  ul.topnav.responsive li.icon {position: absolute;right: 0;top: 0;}
  ul.topnav.responsive li {float: none;display: inline;}
  ul.topnav.responsive li a {display: block;text-align: left;}
}

@media screen and (min-width:800px) and (max-width:1044px){
      ul.topnav{position: relative;top: 0;margin: 0 auto;width: 100%;}
    }
/* END NAV */
h4.king{position: relative;top: 5%;font:italic 400 1.5em/1em 'Open Sans', Arial, Helvetica, sanserif;width: 70%;margin: 20% auto 0;color: #fff;text-shadow: 1px 1px 1px #FECE08;background:rgba(102, 51, 153, 0.5);border-radius: 10px;}

/**************** MAIN *******************/

section{width: 100%;height:auto;padding-top: 50px;}
#section1{padding-top:0; }
#section1 h2{margin-top: 30px;font-size: 2.5em;line-height: 1em;}
section h2{margin: 0 0 0 10%;font-size: 2.5em;line-height: 1em;color: #FC8C3B;text-shadow: 1px 1px 1px #000;}
section h3{text-align: center;}

article{width:80%;height:auto;margin:30px auto 20px;padding:20px 10px 40px;overflow: hidden;border: 5px solid #eee;background-color: #fff;border-radius: 12px;}

#fancy-quote{position:relative;top:30px;margin:0px auto 30px;width:100%;height:auto;padding:10px;}
#fancy-quote p{width:100%;margin: 0 auto;font-size:1.3em;line-height: 1.5em;text-align:center;font-family:Georgia;font-style: italic;}

article h2{color: #5A6673;font-weight: 100;}
article h3{padding:0 0 0 10px;line-height: 1.5em}
article h4{padding:0 0 0 10px;}
article h5{margin-top: 10px;padding:0 0 0 10px;}
.featuretxt{padding:0 0 0 10px;}
.post-cnt{float:left;width: 55%;height: auto;margin: 0;padding:0;}
.post-img{float: right;width: 35%;margin:0;padding: 10px;}
.post-img img{width: 90%;height: auto;margin:10px auto;border: 2px solid #007D53;border-radius: 12px;box-shadow:9px 8px 12px #666666;}
.post-img p{font-size: .9em;}


/***************************** FEATURE LINK BOX ***********************************************/

#feature{position:relative;top:0;margin:0 auto;padding:0;width:90%;height:auto;
-moz-border-radius: 12px 0 0 12px;-khtml-border-radius:  12px 0 0 12px;-webkit-border-radius: 12px 0 0 12px;border-radius:  12px 0 0 12px;}

#feature ul{display:block;}
#feature ul li{margin:0;padding:10px 0 10px 10px;width:260px;height:auto;font-size:1em;font-weight:bold;text-align:left;background-color:#2bb0e7;margin-bottom: 5px;border-radius: 10px;
background: #00b25a;}

/*background: url(images/navigation.png) repeat-x 0 0; box-shadow: 0px -1px 2px rgba(0,0,0,0.1); -moz-box-shadow: 0px -1px 2px rgba(0,0,0,0.1); -webkit-box-shadow: 0px -1px 2px rgba(0,0,0,0.1); -o-box-shadow: 0px -1px 2px rgba(0,0,0,0.1);}*/

#feature ul li a{text-decoration:none;color:#fff;padding-bottom: 10px;margin-bottom: 0px;border:none;border-radius: 10px;}
#feature ul li a:hover{display:block;text-decoration:none;color:#0000ff;background-color:#B93B8F;margin:-10px 0 0px;padding:10px 0 0 0;width:260px;height:30px;font-size:1em;font-weight:bold;-moz-border-radius:10px;-khtml-border-radius:10px;-webkit-border-radius:10px;border-radius:10px;border:1px solid #999;border-radius:7px;-webkit-box-shadow:4px 5px 5px #888888; /* Safari and Chrome */
box-shadow: 4px 5px 5px #888888;
background-color: #00b52a;}

/************************ LEARN and QUOTE BUTTONS *********************/

p.learn{float:left; font-size:1.5em;margin: 10px 0;padding:10px;width: auto;height:auto;text-align:center;background-color: #00b52a;box-shadow: 2px 2px 4px #666;border: 1px solid green;}
p.learn a{text-decoration:none;color:#fff;}            
p.learn a:hover{color: orange;}

p.quote{float:right; font-size:1.5em;margin: 10px 0;padding:10px;width: auto;height:auto;text-align:center;background-color: #00b52a;box-shadow: 2px 2px 4px #666;border: 1px solid green;}
p.quote a{text-decoration:none;color:#fff;}            
p.quote a:hover{color: orange;}
 
/******************CSS3 BUTTONS *****************/
p.getstarted{font-size:.9em;padding:5px 0 0 10px;width: auto;height:auto;text-align:center;}
.getstarted a{color:#fff;text-align: center;width:auto;height:auto;margin:0;padding:5px;font-size:1em;font-family:HelveticaNeue, arial, helvetica, sans-serif;font-weight:200;border:1px solid #999;
border-radius:4px;background-color: #00b52a;text-decoration: none;
-webkit-box-shadow: 3px 3px 5px #333; /* Safari and Chrome */
box-shadow: 3px 3px 5px #333;
}
.getstarted a:hover{display:block;color:#fff;width: auto;height:auto;margin:0;padding:5px; text-decoration:none;font-size:.9em;font-family:arial, helvetica sans-serif;font-weight:700;border:1px solid #999;
border-radius:7px;
-webkit-box-shadow: 4px 5px 5px #888888; /* Safari and Chrome */
box-shadow: 4px 5px 5px #888888;
}

	
footer{position:relative;top:20px;left:0;width: 100%;height:auto;padding:0;background-color:#e1e1e1;}			
footer p{color:#24749f;margin:0px;font-size: .75em;letter-spacing: 2px;text-align:center;padding:0;}
footer a:link{color:#24749f;}			
footer a:visited{color: #0060ff;}
footer a:hover{color: #00FFFF;}
footer p img{vertical-align:sub;}		

/*************************************** FOOTNAV  ********************************************/
		
ul{list-style-type:none;}
ul#footnav{position:relative;top:30px;margin:0 auto;width:680px;height:25px;padding:0;}
ul#footnav li{float:left;margin:0;padding:0 0 3px 0;color:#3d73b3;font-family:Arial; text-transform:uppercase;font-size:.85em;}
ul#footnav li a{text-decoration:none;padding:0 10px 10px 15px;}
ul#footnav li a:hover{color:#ffc19f;text-shadow:1px 1px 1px #000;}						
ul#footnav li.current a{color:#6699ff;font-weight:bold;} 
ul#footnav li a:visited {color: #24749f;}
			
/* ====== #Media Queries =====================================================================================*/
@media only screen and (max-width:500px) {        
    header{position:relative;width:90%;height:12%;top:0;margin:0 auto;padding:0;overflow: hidden;background:transparent url('images/San-Fernando-Valley-2-860.jpg') center 0/contain no-repeat;}
    .phonebox{display: none;}
    p.freequote{display: none;}
    .toptel1{font-size: .8em;font-weight: 700;color: #00b52a;text-decoration: none;width: 40%;}
    #valueprop{position: relative;top: 0px;width: 100%;height: 80%;margin: 0 auto;padding: 0;background: transparent url('images/Lexus-RX-350-1024.png') no-repeat scroll center / 40%;}
    #slider-wrap{position: relative;top: 2%;width: 100%;height: 100%;margin: 0px auto;padding: 0px;text-align: center;}
    h4.king{position: relative;top: 5%;font:italic 400 1em/1em 'Open Sans', Arial, Helvetica, sanserif;width: 90%;margin: 20% auto 0;color: #fff;text-shadow: 1px 1px 1px #FECE08;background:rgba(102, 51, 153, 0.5);border-radius: 10px;}
	.post-img{float:none;width: 100%;margin: 0 auto;padding: 0;}
      .post-img img{width:90%;margin: 0 auto;}
	  .post-img p{font-size: .9em;}
    .post-cnt{float: none;width:100%;padding: 0 5px;margin: 0;}
    ul#footnav{position:relative;top:3%;margin:0 auto;width:90%;height:auto;padding:0;}
    footer p{position: relative;}
}
@media only screen and (min-width: 490px) and (max-width:767px) {        
	header{position:relative;width:90%;height:80px;top:0px;margin:0 auto;padding:0;/*border: 2px dotted green*/}
    /**** LOGO ****/
   .logo{position:relative;top:0;left:0;margin:0;padding:0;width:50%;height: 100%;background:transparent url('images/VC4C-logo-2.png') no-repeat center/contain;}
    .logo h1{text-indent: -9999px;}
	div.logotext{float: right;}
        .logo h1{display: none;}
        .logo h2{display: none;}
        #tagline{display: none;}
/**/    .phonebox{float: none;top: 5%;  width: 50%;}
        p.freequote{font-size: .8em;line-height: .8em}
        p a.toptel1{font-size: .8em;line-height: .8em}
    h4.king{position: relative;top: 5%;font:italic 400 1.2em/.8em 'Open Sans', Arial, Helvetica, sanserif;width: 100%;height: auto;margin: 20% auto 0;color: #fff;text-shadow: 1px 1px 1px #FECE08;background:rgba(102, 51, 153, 0.5);border-radius: 10px;}
	
	h2{font-size: 26px;}
	section{height: auto;}        
    h2{font-size: 36px;font-family: Avenir, arial, helvetica, sans-serif;color: #0071ef;margin: 10px 0 0 0;}
    h2.vplearn{width: 80px;}	

        /************ FEATURE HOME *******************************/
        
        article{width:90%;height:auto;margin:0 auto;padding:20px 0;}

        article h2{font-weight: 100;line-height: 1.3em;}
        article h3{padding:0 0 0 10px;}
        article h4{padding:0 0 0 10px;}
        article h5{margin-top: 10px;padding:0 0 0 10px;}
        article p{color:#666;text-align:left;margin: 0;padding: 20px 10px ;line-height: 20px;font:.9em/1.2em Arial, helvetica, sans-serif;}
	    .post-img{float:none;width: 100%;margin: 0 auto;padding: 0;}
        .post-img img{width:90%;margin: 0 auto;}
	    .post-img p{font-size: .9em;}
        .post-cnt{width:100%;padding: 0 5px;margin: 0;}
	
	/************************ LEARN and QUOTE BUTTONS *********************/

p.learn{float:left; font-size:16px;margin: 10px;padding:5px;width: auto;height:auto;text-align:center;background-color: #00b52a;box-shadow: 2px 2px 4px #666;border: 1px solid green;}
p.learn a{text-decoration:none;color:#fff;}            
p.learn a:hover{color: orange;}

p.quote{float:right; font-size:16px;margin: 10px 0;padding:5px;width: auto;height:auto;text-align:center;background-color: #00b52a;box-shadow: 2px 2px 4px #666;border: 1px solid green;}
p.quote a{text-decoration:none;color:#fff;}            
p.quote a:hover{color: orange;}
           
        div#footer{width: 100%;background-color: transparent;}
        ul#footnav{width: 100%;}
        footer{width: 100%;height: auto;}
        ul#footnav{width: 100%;height: 60px;}
        footer p{font-size: small;}
}

@media screen and (min-width:767px) and (max-width:1044px){
          .phonebox{float: none;width: 50%;}
          p a.toptel1{font-size: 1em;line-height: 1.2em}
          slider-wrap{width: 100%;}
          article{width: 100%;border: none;}
                  }

