/*********** nickswebworks nick sharpe 042813 ClassiccashForCars Derek E 042018 ******/

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0b1 | 201101  */

html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
margin: 0;padding: 0;border: 0;outline: 0;font-size: 100%;font: inherit;vertical-align: baseline;}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: '';content: none;}
/* remember to define visible focus styles! 
:focus {outline: ?????;} */

/* remember to highlight inserts somehow! */
ins {text-decoration: none;}del {text-decoration: line-through;}table {border-collapse: collapse;border-spacing: 0;}

/*************************************************** END RESET  ************************************************/

/*** © 2013 NicksWebWorks.com - css by Nick Sharpe updated 042813 *************/
body, html { height: 100%; }

body {min-width: 100%;height:100%;font: 1em/1.5em 'Open Sans', Helvetica, Helvetica Neue, Arial, sans-serif;background-color: #65A5EF;background-image: url('http://classiccashforcars.com/images/Redondo-beach16x752.jpg');background-repeat: no-repeat;background-position: top;background-attachment: fixed;}
em{font-style:italic;font-weight:500;}
h1{font-size:152%;margin:0;padding:0px;}			
h2{font-size:132%;margin:0;padding:0;line-height:1.2em;}
h3{font-size:112%;margin:10px 0 5px 0;padding:0;font-weight:bold;}
h4{font-size:95%;padding:0;font-weight:bold;}
h4 em{font-style:oblique;}
p{font-size:1em;margin:0;padding:0;}
.bold{font-weight:bold;}
 @font-face {font-family: avenir ; src: url( 'http://nickswebworks.com/fonts/avenir_65_medium.otf' ) format("opentype"); }      
    /* Then use it like you would any other font */  
.avenir{font-family: Avenir, Arial, helvetica, sans-serif;  }

.quote{font-size: .9em;font-style: italic;font-family: Georgia, serif;}
/*************************** LAYOUT *********************************/

.shell{position:relative;top:0;margin:0 auto;width:100%;height:auto;}		

header {position: relative;top: 0;left: 0; width: 1024px;height: 64px; padding: 0;margin: 0 auto;}

#logo {position: relative;top: 20px;left: 10px;}
#logo a {width: 510px; height: 50px; display: block; background: url('http://classiccashforcars.com/images/classicC4C-logo-1.png') no-repeat 0 0;  text-indent: -8000px; }
h2#logo {display: none;}
.search {position: absolute;top: 10px;right: 40px; width: 240px;}

ul {list-style-type:none;}
ul.socials{position:relative;top:10px;left:0px;margin:0;padding:0;width:440px;height:60px;border: 1px solid #c0c0c0;}
ul.socials li{display:inline;margin:0 10px 0 0;padding:0;color:#fff;}
ul.socials li a{float:left;text-decoration:none;margin:0 10px 0 0;padding:0;font-size: 1.3em;color: #fff;font-family: Open Sans, Arial, helvetica, sans-seriferif;border: none;}
ul.socials li a:hover{color:orange;}

/***************************** NAVIGATION TOP NAV UL ******************************** */

#navigation {width: 1024px;height: 52px;margin: 0 auto;padding-top: 4px; font-family: 'Open Sans', arial, helvetica, sans-serif; font-weight: 200; }
#navigation ul { list-style: none; list-style-position: outside;position: relative;left: 10%; }
#navigation ul li { float: left; padding-right: 2px; line-height: 52px; font-size: 1em;font-weight: bold; text-transform: uppercase; }
#navigation ul li a { display: block; padding: 0 22px 0 10px; color: #eee; text-decoration: none; }
#navigation ul li a:hover,
#navigation ul li.active a  { text-decoration: none; color: #20ef15; }
#navigation ul li.first a { padding-left: 38px; }
#navigation a.nav-btn { display: none; }

/************** VALUEPROP ***************************************************/
#slider-wrap{position:relative;top:0;width:100%;height:50VH;margin:0 auto;padding:0;/*background-color: rgba(238, 238, 238, 0.5);border-radius: 10px 10px 0 0;*/}
#slider-wrap a{color: #fff;text-decoration: none;}

/********* VP Buttons   ********************/
    #slider-wrap h2.vplearn{float: left;top:220px;left: 40px;width:160px;padding: 10px 0 20px 10px;font-style: italic;font-size: 1.5em;font-weight: 500;}
    #slider-wrap h2.vpstarted{float: right;top:220px;left: 240px;width: 160px;padding: 10px 0 20px 10px;font-style: italic;font-size: 1.5em;font-weight: 500;color: #fff;} 

    #slider-wrap h2.vplearn a:hover{color: orange}
    #slider-wrap h2.vpstarted a:hover{color: orange}


section{width: 100%;height:auto;margin: 0;padding:54px 0 0;overflow: hidden;}

article.feature-home{width:80%;height:auto;margin:0 auto;padding:0;background-color: rgba(255, 255, 255, 0.7);border-radius:12px;overflow: hidden;}
.feature-home p{margin: 10px 0;}
.feature-home h2{font-weight: 100;}
.feature-home h3{padding:0 0 0 10px;color: #666;}
.feature-home h4{padding:0 0 0 10px;}
.feature-home h5{margin-top: 10px;padding:0 0 0 10px;}

div.post-cnt{float:left;width: 55%;height: auto;margin: 0;padding: 0;text-align: justify;}
div.post-cnt p{color: #494949;}
p.readmore{font-size: .9em;}
div.post-img{float:right;width:40%;margin:0;padding: 10px;}
div.post-img img{width: 420px;margin: 30px 0 0 5px;border-radius: 6px;}
div.post-img p{margin-left: 30px;font-size: .9em;color: #333;}


ul.list{position:relative;top:0px;left:0;margin:0 0 20px 0;padding:0;width:300px;height:180px;list-style:disc inside;}
ul.list li{margin-top:-2px;padding:0;color:#000;font-size:1em;*font-size:.9em;line-height:2em;font-weight:bold;text-transform:uppercase;text-align:left;font-family:'open sans', sans-serif;} ul.list a{color:green;text-decoration:none;}

#fancy-quote{clear: both;position:relative;top:0;margin:0 auto;padding:0;width:60%;height:auto}
#fancy-quote p{width:820px;margin: 0 auto;font-size:1.1em;line-height: 1.3em;text-align:center;font-family:Georgia;font-style: italic;}

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

#feature{position:relative;top:0;left:0;margin:0px;padding:0;width:260px;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: #b4ddb4; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2I0ZGRiNCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjE3JSIgc3RvcC1jb2xvcj0iIzgzYzc4MyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjMzJSIgc3RvcC1jb2xvcj0iIzUyYjE1MiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjY3JSIgc3RvcC1jb2xvcj0iIzAwYTAwOSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjgzJSIgc3RvcC1jb2xvcj0iIzAwNTcwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDI0MDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top,  #b4ddb4 0%, #83c783 17%, #52b152 33%, #00a009 67%, #005700 83%, #002400 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b4ddb4), color-stop(17%,#83c783), color-stop(33%,#52b152), color-stop(67%,#00a009), color-stop(83%,#005700), color-stop(100%,#002400)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #b4ddb4 0%,#83c783 17%,#52b152 33%,#00a009 67%,#005700 83%,#002400 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #b4ddb4 0%,#83c783 17%,#52b152 33%,#00a009 67%,#005700 83%,#002400 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #b4ddb4 0%,#83c783 17%,#52b152 33%,#00a009 67%,#005700 83%,#002400 100%); /* IE10+ */
background: linear-gradient(to bottom,  #b4ddb4 0%,#83c783 17%,#52b152 33%,#00a009 67%,#005700 83%,#002400 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b4ddb4', endColorstr='#002400',GradientType=0 ); /* IE6-8 */
}

/*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: #5c8756; /* Old browsers */
background: -moz-linear-gradient(top, #5c8756 0%, #61c419 19%, #b4e391 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5c8756), color-stop(19%,#61c419), color-stop(100%,#b4e391)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #5c8756 0%,#61c419 19%,#b4e391 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #5c8756 0%,#61c419 19%,#b4e391 100%); /* Opera11.10+ */
background: -ms-linear-gradient(top, #5c8756 0%,#61c419 19%,#b4e391 100%); /* IE10+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5c8756', endColorstr='#b4e391',GradientType=0 ); /* IE6-9 */
background: linear-gradient(top, #5c8756 0%,#61c419 19%,#b4e391 100%); /* W3C */}


/******************CSS3 BUTTONS *****************/

h2.getstarted{text-decoration: none;color:#fff;width:200px;height:20px;margin:15px auto 0;padding:7px 0 8px 20px;font-size:1.4em;font-family:'Open Sans', arial, helvetica sans-serif;font-weight:700;border:1px solid #999;
border-radius:7px;
-webkit-box-shadow: 3px 3px 5px #333; /* Safari and Chrome */
box-shadow: 3px 3px 5px #333;
background: rgb(64,196,39); /* Old browsers */
background: -moz-linear-gradient(top, rgba(180,221,180,1) 0%, rgba(126,215,109,1) 17%, rgba(88,203,67,1) 33%, rgba(70,198,46,1) 67%, rgba(64,196,39,1) 83%, rgba(0,36,0,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(180,221,180,1)), color-stop(17%,rgba(126,215,109,1)), color-stop(33%,rgba(70,198,46,1)), color-stop(67%,rgba(0,138,0,1)), color-stop(83%,rgba(0,87,0,1)), color-stop(100%,rgba(0,36,0,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(180,221,180,1) 0%,rgba(126,215,109,1) 17%,rgba(70,198,46,1) 33%,rgba(0,138,0,1) 67%,rgba(0,87,0,1) 83%,rgba(0,36,0,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(180,221,180,1) 0%,rgba(126,215,109,1) 17%,rgba(70,198,46,1) 33%,rgba(0,138,0,1) 67%,rgba(0,87,0,1) 83%,rgba(0,36,0,1) 100%); /* Opera11.10+ */
background: -ms-linear-gradient(top, rgba(180,221,180,1) 0%,rgba(126,215,109,1) 17%,rgba(70,198,46,1) 33%,rgba(0,138,0,1) 67%,rgba(0,87,0,1) 83%,rgba(0,36,0,1) 100%); /* IE10+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b4ddb4', endColorstr='#002400',GradientType=0 ); /* IE6-9 */
background: linear-gradient(top, rgba(180,221,180,1) 0%,rgba(131,199,131,1) 17%,rgba(126,215,109,1) 33%,rgba(0,138,0,1) 67%,rgba(0,87,0,1) 83%,rgba(0,36,0,1) 100%); /* W3C */
}
h2.getstarted a:hover{display:block;color:orange;}
h3.readmore, #full980 h3.readmore{color:#fff;width:160px;height:20px;margin:15px auto 0;padding:7px 0 8px 20px;font-size:1.1em;font-family:Ubuntu, 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;
background: rgb(180,221,180); /* Old browsers */
background: -moz-linear-gradient(top, rgba(180,221,180,1) 0%, rgba(131,199,131,1) 17%, rgba(82,177,82,1) 33%, rgba(0,138,0,1) 67%, rgba(0,87,0,1) 83%, rgba(0,36,0,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(180,221,180,1)), color-stop(17%,rgba(131,199,131,1)), color-stop(33%,rgba(82,177,82,1)), color-stop(67%,rgba(0,138,0,1)), color-stop(83%,rgba(0,87,0,1)), color-stop(100%,rgba(0,36,0,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(180,221,180,1) 0%,rgba(131,199,131,1) 17%,rgba(82,177,82,1) 33%,rgba(0,138,0,1) 67%,rgba(0,87,0,1) 83%,rgba(0,36,0,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(180,221,180,1) 0%,rgba(131,199,131,1) 17%,rgba(82,177,82,1) 33%,rgba(0,138,0,1) 67%,rgba(0,87,0,1) 83%,rgba(0,36,0,1) 100%); /* Opera11.10+ */
background: -ms-linear-gradient(top, rgba(180,221,180,1) 0%,rgba(131,199,131,1) 17%,rgba(82,177,82,1) 33%,rgba(0,138,0,1) 67%,rgba(0,87,0,1) 83%,rgba(0,36,0,1) 100%); /* IE10+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b4ddb4', endColorstr='#002400',GradientType=0 ); /* IE6-9 */
background: linear-gradient(top, rgba(180,221,180,1) 0%,rgba(131,199,131,1) 17%,rgba(82,177,82,1) 33%,rgba(0,138,0,1) 67%,rgba(0,87,0,1) 83%,rgba(0,36,0,1) 100%); /* W3C */
}
h3.readmore a:hover{display:block;color:#fff;width:160px;height:20px;margin:-10px 0 0 -20px;padding:7px 0 20px 35px; text-decoration:none;font-size:1em;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;
background: #5c8756; /* Old browsers */
background: -moz-linear-gradient(top, #5c8756 0%, #61c419 19%, #b4e391 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5c8756), color-stop(19%,#61c419), color-stop(100%,#b4e391)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #5c8756 0%,#61c419 19%,#b4e391 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #5c8756 0%,#61c419 19%,#b4e391 100%); /* Opera11.10+ */
background: -ms-linear-gradient(top, #5c8756 0%,#61c419 19%,#b4e391 100%); /* IE10+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5c8756', endColorstr='#b4e391',GradientType=0 ); /* IE6-9 */
background: linear-gradient(top, #5c8756 0%,#61c419 19%,#b4e391 100%); /* W3C */
}

div.bottomquote{float: left;}
	
footer{position:relative;top:0px;left:0;width: 100%;height:100px;margin-top: 100px;padding:20px 0;background-color:transparent;}			
footer p{color:#000;margin:5px;font-size: .7em;letter-spacing: 2px;text-align:center;padding: 0px 2px 5px 2px;background-color: rgba(255, 255, 255, 0.5);}
footer a:link{color:#fff;}			
footer a:visited{color:#fff;}
footer a:hover{color: #00FFFF;}
footer p img{vertical-align:sub;}		

/*************************************** FOOTNAV  ********************************************/
		
ul{list-style-type:none;}
ul#footnav{position:relative;top:10px;margin:0 auto;width:760px;height:25px;padding:0;background-color: rgba(255, 255, 255, 0.5);border-radius: 8px;}
ul#footnav li{float:left;margin:0;padding:0 0 3px 0;color:#3d73b3;font-family:Arial; text-transform:uppercase;font-size:.8em;font-weight: bold;}
ul#footnav li a{text-decoration:none;padding:0 10px 10px 10px;color: #000;}
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: orange;}
			
@media only screen and (max-width: 640px) {
    article{width: 90%;}
	.post-img{float: none;width: 100%;}
	.post-cnt{float: none;width: 100%;}
    }
