/*
Theme Name: Ferruccio - Business - Child
Theme URI: https://www.autosoft.eu
Template:     Ferruccio
Author: Autosoft - Automotive internet
Author URI: https://www.autosoft.eu/
Description: Ferruccio CHILD Thema, ontworpen en ontwikkeld door Autosoft. Afgeleide van het Autosoft Ferruccio thema voor klantspecifieke aanpassingen.
Version: 1.0
Text Domain: autosoft
*/

/****************************************************
 
  Design: Autosoft BV - www.autosoft.eu
  Code & CSS: Autosoft BV - www.autosoft.eu
  Copyright 2023 Autosoft BV
  
****************************************************/

/* main fonts & titles */
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=El+Messiri:wght@400..700&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');


/* CUSTOM THEME COLORS and DEFAULTS */
:root {
	--ASsite:			1380px;		/* website sizing */
	--ASgutter:			10px;		/* gutter sizing */
	--ASgap:			80px;		/* flex gap */
	--ASanimation:		450ms;		/* animation speed */ 
	--ASfastanimation:	250ms;		/* animation faster */
	
	--ASbg: 			#ffffff; 	/* site BG */
	--AScolorbg:		#333333; 	/* page BG */
	--ASprimarycolor:	#795916; 	/* primary color accent */
	--ASsecondarycolor:	#a78948; 	/* secondary color accent */
	--AStertiarycolor:	#191919; 	/* third color accent */
	
	--ASfontfamily:		'Roboto', Helvetica, Arial, sans-serif; /* base font family */
	--ASfontsize:		16px;		/* base font size */
	--ASlineheight:		1.5em;		/* base line height */
	--ASfontweight:		400;		/* base font weight */
	--ASfontbold:		500;		/* base font weight */
	--ASfontcolor: 		#191919;	/* main text color */
	--AScolortext: 		#ffffff;	/* text on colored BG */
	
	--AStitlefamily:	'Bebas Neue', Helvetica, Arial, sans-serif; /* base title font family */
	--AStitlesize:		32px;		/* base title size */
	--AStitleheight:	1.5em;		/* base title height */
	--AStitleweight:	500;		/* base title weight */
	--AStitlecolor: 	#a87811;	/* main title color */
	--AStitletransform: none;	/* main title transform */
	
	--ASlogofamily:		'El Messiri', Helvetica, Arial, sans-serif; /* base title logo font family */
	--ASlogosize:		3.65rem; 	/* base title font family */

	--ASbordercolor:	#aaaaaa;	/* border color */
}



/* OTHER CUSTOMIZATIONS */


/* = GLOBALS 
***************************************/


/* = HEADER 
***************************************/

#mainheader #topbar #branding .widget a img {
    height: 180px !important;
    margin-bottom: -110px;
	border: 12px solid black;
	border-radius: 80px;
}
#mainheader #topbar.shrink #branding .widget a img {
    height: calc(180px / 2) !important;
	margin-bottom: -60px;
}

/* = MENU
  -------------------------------------------------------------- */
#menu li:hover > a, #menu a:focus {
    color: var(--AStitlecolor);
}

#menu .current-menu-item > a, #menu .current-menu-ancestor > a, 
#menu .current_page_item > a, #menu .current_page_ancestor > a, 
#menu .current-post-parent > a {
    color: var(--AStitlecolor);
}

#menu ul ul :hover > a  {
    background: var(--AStitlecolor);
    color: #ffffff!important;
}

#menu ul ul .current-menu-item > a {
	background: #FFFFFF;
    color: var(--AStitlecolor)!important;
}

/* = HERO
  -------------------------------------------------------------- */
body.home #siteheader #herocontent {
    min-height: 70vh;
}

#siteheader #herotitle .wrapper { text-align: center; }
#siteheader #herotitle p { 
	width: 60%; 
	margin: auto; 
	text-shadow: 1px 1px 0px #ffffff;
	font-family: var(--ASlogofamily); 
	text-transform: uppercase; 
	font-weight: 700; 
}

body.home #siteheader #herotitle p {
    font-size: 5.2rem;
    width: 80%;
}

/* = MAIN CONTENT 
***************************************/

/* = Content animation
  -------------------------------------------------------------- */ 
  
/* = Sections
  -------------------------------------------------------------- */ 
section header h2 { font-weight: normal; } 

section#vehicles { 
	background: #f4f4f4;
	background: var(--AScolorbg);
	padding-bottom: calc(10px * 4);
    padding-bottom: calc(var(--ASgutter) * 4);
}

section#vehicles h3 {
	padding-top: 0;
}

section#vehicles a.pagelink, 
section#vehicles a span.pagelink,
section#vehicles ul li {
    background: #ffffff;
    background: var(--ASbg);
}

/* = Services & Homepage actualiteiten
  -------------------------------------------------------------- */
section#services .kader h3 { font-size: 2.5rem; }
section#blog .kader h3 { font-size: 2rem; }

 main#sitecontent section#services {
	padding-top: 10px;
    padding-top: var(--ASgutter);
	background: #ffffff;
    background: var(--ASbg);
}

/* = MAIN PAGES 
***************************************/

/* = Blogposts
  ------------------------------------------- */

/* = Blogposts SINGLE
  ------------------------------------------- */

/* = SIDEBARS
  ------------------------------------------- */
  
/* = TEAM
  ------------------------------------------- */
  

/* = FOOTER 
***************************************/
#scrolltop { display: none; }

#sitefooter { background: #000000!important; }

/* CONTACT TABS
  ------------------------------------------- */


/* = WORDPRESS SPECIFIC FUNCTIONS 
***************************************/

/* = forms
  ------------------------------------------- */
form.wpcf7-form input.wpcf7-submit, form#searchform input#searchsubmit { border: 1px solid transparent; }

/* = fotogallery
  ------------------------------------------- */

/* = Searchform
  ------------------------------------------- */

/* Klantenvertellen beoordelingen
  ------------------------------------------- */
  

/* = PAGEBUILDERS
***************************************/


/* = MISC
***************************************/



/* = AUTOCOMMERCE SPECIFIC 
***************************************/
#carslider { display: none; }


/* = MEDIA QUERIES 
***************************************/

@media only screen and (-webkit-min-device-pixel-ratio:1.5),
	   only screen and (min-resolution:144dpi) {

}

/* bigger Desktops - smaller than 1500 */
@media only screen and (max-width:1499px) {

}

/* big Desktops - smaller than 1280 */
@media only screen and (max-width:1299px) {

}

/* big Desktops - smaller than 1200 */
@media only screen and (max-width:1199px) {
	#siteheader #herotitle { margin-top: 6rem; }
	#siteheader #herotitle p { font-size: 3.2rem; }
	body.home #siteheader #herotitle { margin-top: 8rem; }
	body.home #siteheader #herotitle p { font-size: 3.2rem; }
}

/* small Desktops - smaller than 992 */
@media only screen and (max-width:991px) {

}

/* big tablets - smaller than 820 */
@media only screen and (max-width:820px) {

}

/* most Tablets - smaller than 768 */
@media only screen and (max-width:767px) {
	
}

/* small Tablets - smaller than 650 */
@media only screen and (max-width:649px) {
	
	body:not(.home) #mainheader #topbar #branding .widget a img,
	#mainheader #topbar.shrink #branding .widget a img {
		height: calc(180px / 2) !important;
		margin-bottom: -50px; 
	}
	#mainheader #topbar.shrink #branding .widget a img { margin-top: -20px; }
	
	body.home #mainheader #topbar #branding .widget a img {
		height: 140px !important;
		margin-bottom: -80px; 
	}
	body.home #mainheader #topbar.shrink #branding .widget a img {
		height: calc(180px / 2) !important;
		margin-bottom: -60px; 
	}
	
	#siteheader #herotitle { margin-top: 6rem; }
	#siteheader #herotitle p { font-size: 2.2rem; }
	body.home #siteheader #herotitle { margin-top: 12rem; }
	body.home #siteheader #herotitle p { font-size: 2.2rem; }
}

/* smaller devices & phones - smaller than 480 */
@media only screen and (max-width:479px) {

}




/* = MOBILE MENU 
***************************************/

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

}




/* = DARK THEME 
***************************************/
:root {
	--ASbg: 			#000000; 	/* site BG */
	--AScolorbg:		#1e1e1e; 	/* page BG */
	--ASprimarycolor:	#927357; 	/* primary color accent */
	--ASsecondarycolor:	#c6b19e; 	/* secondary color accent */
	--AStertiarycolor:	#e6e6e6; 	/* third color accent */
	
	--ASfontcolor: 		#e6e6e6;	/* main text color */
	--AScolortext: 		#ffffff;	/* text on colored BG */
	
	--AStitlecolor: 	#927357;	/* main title color */

	--ASbordercolor:	#555555;	/* border color */
}

#menu a, #menu ul ul a,
#menu li.menu-item-has-children li a { 
	color: var(--ASfontcolor); 
}

#menu ul ul li:hover a,
#menu li.menu-item-has-children li:hover a { 
	color: var(--AScolorbg); 
}

#siteheader #headerlinks.headerquicklinks ul li a { 
	color: #ffffff; 
}

#siteheader #headerlinks.headerquicklinks ul li a:hover { 
	color: var(--ASsecondarycolor); 
}

#siteheader #herocontent {
	background: radial-gradient(at top right,rgba(0,0,0,0),rgba(0,0,0,0.5) 100%);	
}

#siteheader #herocontent .scrollbutton a,
#scrolltop a.backtotop { 
	outline: 6px solid rgba(0,0,0,0.75); 
}

#siteheader #ACzoeker .wrapper {
    background: rgba(0,0,0,0.5);
}

.pretitle { color: #ffffff; }

section .kader h3, section .kader p { 
	text-shadow: 1px 1px 0px #000000;
}

body:not(.home, .error404) main#sitecontent section:first-child a.pagelink {
    background: var(--AScolorbg);
}

a.pagelink::before, a.pagelink::after {
	background: var(--ASfontcolor);
}

ul.ctatabs li.bellentab a,
ul.ctatabs li.emailtab a, 
ul.ctatabs li.facebooktab a, 
ul.ctatabs li.whatsapptab a, 
ul.ctatabs li.instagramtab a, 
ul.ctatabs li.twittertab a, 
ul.ctatabs li.youtubetab a, 
ul.ctatabs li.linkedintab a { 
	border-color: var(--ASprimarycolor); 
}


/* = AUTOCOMMERCE SPECIFIC OVERRIDES
***************************************/

:root {
    --ACfontfamily: var(--ASfontfamily);
    --ACfontsize: var(--ASfontsize);
    --AClineheight: var(--ASlineheight);
    --ACfontweight: var(--ASfontweight);
    --ACbgwrapper: var(--AScolorbg);
    --ACbgcolor: #333333;
    --ACbgcolorl: #111111;
    --ACoverlay: var(--ASbg);
    --ACshade: #111111;
    --ACshade2: #000000;
    --ACmaincolor: var(--ASprimarycolor);
    --ACbordercolor: #333333;
    --ACtextcolor: var(--ASfontcolor);
    --ACcolortext: var(--AScolortext);
    --AClighttext: #aaaaaa;
    --ACgutter: calc(var(--ASgutter) * 2);
    --ACimgpadding: 65%;
}

/* = DARK THEME END
***************************************/

/****************************************************
 
  Design: Autosoft BV - www.autosoft.eu
  Code & CSS: Autosoft BV - www.autosoft.eu
  Copyright 2023 Autosoft BV
  
****************************************************/