@import "./palette.css" ;

body,html{margin:0; padding:0;}
body
{
	background-color:var(--body-bg-1st-color) ;
	color:var(--body-txt-color);
	font-family: "Roboto", sans-serif;
	font-weight: 400;
	font-style: normal;
	padding-bottom:50px;
}
div, section
{
	box-sizing:border-box;
}
h2{ margin:2px;padding:2px; }

#background-top
{
	background-color:var( --body-bg-2nd-color );
	display:block;
	position:fixed;
	top:0;
	left:0;
	height:300px;
	width:100%;
	border-bottom:1px solid var( --body-brdr-color );
}

#main
{
	position:relative;
	display:block;
	width:calc(100% - 300px ) ;
	border-radius:9px;
    top: 30px;
	margin:auto;
	background-color:#fefefe;
	overflow:hidden ;
	border:1px solid var(--main-bg-color);
}

#header
{
	display:block;
	position:absolute; 
	top:0; 
	z-index: 10;
	box-sizing:border-box;
  	width: 100% ;
	padding:0;
  	text-align:center;
	background-color:rgba(255,255,255,0.8)
}

#header #title
{
	font-family: "MonteCarlo", cursive;
	font-size:75px;
	padding:30px 0 0 0; 	
}

#header #subtitle
{
	font-size:13px;
	padding:0 0 15px 0 ; 	
}

#header #subtitle a 
{
	color:var( --header-a-color );
}

#slider
{
	height:500px;
	z-index:1;
}
#slider-ol 
{
	position:absolute;
	display:block;
	background-color:white;
	width:100%;
	height:500px;
	z-index:2;
}

footer
{
	font-size:15px;
	text-align:center;
	background-color: var( --footer-bg ) ;
	color:var( --footer-color );
	padding:20px 0 ;
	margin-top:10px;
}
footer h2
{
	font-size:21px;
	margin:0;padding:0;
	background-color:#333;
	color:#fefefe;
}

footer
{}

footer a 
{
	color:var( --footer-a-color );
}
footer a:hover
{
	color:var( --footer-a_hover-color );
}
{
	
}
footer address
{
    font-style: normal;
    font-size: 11px;
    line-height: 17px;
}


#console
{
	display:none;
	width:300px;
	height:300px;
	background-color:#222;
	color:#ccc;
	
	font-family:monospace;
	
	position:absolute;
	top:0;
	left:0;
	z-index:9999;
	
	overflow:auto;
}

section 
{}

section h2
{
	margin:0;
	margin-bottom:10px;
	
}

section.slider
{
	
	
}

section.separator
{
	height:30px;
	display:block;
	clear:both;
}

section.container
{
	padding:20px;
	background-color:var(--section-bg-color-01) ;
}

section.container section.col
{
	display:block;
	margin:10px;
    padding:25px;
	box-sizing:border-box;
	text-align:left;
	
	/*
	border-radius:9px;
	background-color:var(--section-col-bg-color-02) ;
	border-top:1px solid rgba(0,0,0,0.15);
	*/
}


section.container.alt
{
	background-color:var(--section-bg-color-02) ;
	
}

section.container.big p
{
	font-size:23px;
	line-height:32px;
}

section.container.centered .col
{
	text-align:center;
}

section.container.cols-2 .col
{
	width:calc( 50% - 20px ); 
	float:left;
}

section.container.cols-2:after
{
	content: '';
    display: block;
    clear: both;
}

section.container.cols-2 .col img
{
	position:relative;
	width:100%;
}


section .description
{
	font-size:15px;
	line-height:24px;
}


@media( min-width:1700px )
{
	#main
	{
		width:1300px;
	}
}

@media( max-width:1400px )
{
	#main
	{
		width:calc(100% - 100px ) ;
	}
}
@media( max-width:1200px )
{
	#main
	{
		width:calc(100% - 150px ) ;
	}
}
@media( max-width:950px )
{
	#main
	{
		width:100% ;
		top:0; 
		border-radius:0;
		border:0;
	}
	
	#header
	{
		position:relative;
	}
	
	#header #title
	{
		font-size: 70px;
		
	}
	
	section.container section.col
	{
		padding: 15px;
	}
}
@media( max-width:700px )
{	
	section.container.cols-2 .col
	{
		float:none;
		width:100%;
	}
	
	#header #title
	{
		font-size: 50px;
        line-height: 50px;
        padding-bottom: 15px;
		
	}
	#header #subtitle
	{
		font-size: 11px;
	}
}

/* FIX COOKIES */
#tsmcl-dsc, #tsmcl-dsc p
{
    font-size: 13px;
}
#tsmcl-dsc 
{
    height: 145px;
}