html, body {
	height:100%;
	margin:0;
	padding:0;
}
body *{
	font-family: Arial, sans-serif;
	outline: none;
}
button:focus, button::-moz-focus-inner { 
    outline: none; 
	border:0px;
}
.container{
    position: relative;
    top: 40%;
    transform: translateY(-50%);
    text-align:center;
    width:100%;
}
header{
	height:75px;
	width:580px;
	text-align:center;
	margin:0 auto 0 auto;
}
header .logo{
	height:100%;
	width:100%;
	background-repeat:no-repeat;
	background-size:auto 100%;
	background-position:center;
/*	background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 855 200' style='enable-background:new 0 0 855 200;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%232D7DFD;%7D .st1%7Bfill:%23F62F1F;%7D .st2%7Bfill:%231BA742;%7D .st3%7Bfill:%23FDBF05;%7D%0A%3C/style%3E%3Cg%3E%3Cpath class='st0' d='M20.4,97.5c0-24.8,0-49.6,0-74.4c0-4.5,0.3-4.9,4.7-4.9c19,0,38-0.3,56.9,0.1c21.6,0.4,41.4,6.8,57.6,21.6 c14.7,13.4,22.2,30.5,23.1,50.4c0.5,11.5,0.6,23-3.1,34.1c-7.9,23.8-23.9,39.8-47.6,48.1c-11,3.9-22.3,5-33.8,5 c-17.8,0-35.6,0-53.5,0.1c-3,0-4.5-0.6-4.5-4.2C20.4,148.1,20.3,122.8,20.4,97.5C20.4,97.5,20.4,97.5,20.4,97.5z M48.8,40.6 c-0.1,2.5-0.3,4.3-0.3,6.1c0,32.5,0,64.9,0,97.4c0,2.5,0,5-0.1,7.5c0,2.4,1,3.8,3.5,3.7c14.4-0.3,29,1.3,43.1-3.1 c14.8-4.5,26.8-12.6,33.5-27c7.6-16.3,8.3-33,1.9-49.8C125.1,61,115,51.4,100.8,45.7C84.1,38.9,66.8,41.3,48.8,40.6z'/%3E%3Cpath class='st1' d='M662.4,74c0-19.2,0-37.1,0-55.4c7.9,0,15.5,0,23.5,0c0,52.8,0,105.5,0,158.5c-7.3,0-14.4,0-21.9,0 c-0.4-2.1-0.7-4.3-1.1-6.9c-1.1,0.5-1.9,0.6-2.5,1.1c-8.1,7.8-18.3,10-29,10.1c-9.8,0.1-19-2.6-27.2-8.5 c-8.8-6.3-14.4-14.8-18.2-24.5c-6.8-17.3-6.7-35,0.1-52.2c10.9-27.3,35.1-38.3,62.3-29.7c3.4,1.1,6.4,3.4,9.6,5.1 C659.2,72.4,660.3,72.9,662.4,74z M605.9,125.6c0.4,11.5,5.4,23.2,18.2,30.6c4.1,2.3,8.4,4,13.3,3c7.6-1.5,13.5-5.6,18-11.6 c11.7-15.8,10-40.7-3.4-53.8c-10.3-10.1-23-11.1-33.9-0.4C609.6,101.5,605.9,111.4,605.9,125.6z'/%3E%3Cpath class='st2' d='M543,67.8c8.2,0,15.9,0,24.1,0c0,2.2,0,4,0,5.8c0,33.1,0,66.3,0.1,99.4c0,3.1-0.7,4.6-4.1,4.5 c-6.3-0.2-12.6-0.1-19-0.1c-0.2-2.5-0.3-4.2-0.5-6.9c-1.7,1.1-3,1.7-4,2.6c-12.9,11.5-39.8,10.4-51.4,1c-8-6.5-12-15-13.2-24.8 c-0.8-6.1-0.7-12.2-0.7-18.4c-0.2-18.6-0.2-37.3-0.3-55.9c0-1.5,0-3,0-4.5c-0.1-2.1,0.9-3.1,3-3.1c7,0,13.9,0,21.6,0 c0,2.3,0,4.2,0,6.2c0,20.8-0.1,41.6,0,62.4c0,6.5,1.7,12.7,6.5,17.3c7.6,7.1,17.1,8.6,25.6,1.7c8.9-7.3,12.3-17,12.3-28.2 c0-18.2-0.1-36.3-0.1-54.5C542.8,70.9,542.9,69.6,543,67.8z'/%3E%3Cpath class='st1' d='M202.5,137.9c3.2,10.7,14.1,17.8,26.2,17.3c11.9-0.5,21.4-5.5,27.8-15.7c5.5,3.7,10.6,7.1,15.7,10.5 c2.2,1.5,2.2,3,0.6,5c-11,13.3-24.7,21.2-42.4,21.9c-35.4,1.4-61.4-32.4-56.1-64.4c3.6-21.4,15.3-36.8,35.6-44.6 c20.6-8,41.5-1.1,54.3,16.1c4.1,5.5,7.1,12,10.3,18.2c2.1,4,1.7,4.6-2.3,6.4c-9.3,4-18.7,7.9-28,11.9 C230.3,126.1,216.5,131.9,202.5,137.9z M247.5,98.3c-5-10.2-17-14.2-28.9-10.6c-14.4,4.3-22.2,18-20.3,31.6 C214.8,112.3,231,105.4,247.5,98.3z'/%3E%3Cpath class='st0' d='M387.2,138.1c3.2,8.4,8.9,13.6,17,15.9c13,3.8,26.9-0.8,35.2-11.6c1.7-2.2,2.9-2.7,5.2-0.9 c3.9,2.9,7.9,5.5,12,8.1c2.1,1.4,3.3,2.9,1.5,5.3c-9.4,11.8-21.4,19.8-36.4,21.7c-18.5,2.4-34.7-3.3-47.4-17.1 C346,129,358,82.4,394.7,67.7c21-8.4,43,0,54.6,16.4c4.1,5.8,7,12.4,10.5,18.6c1.5,2.6,0.6,4-1.8,5c-6.9,3-13.7,6.1-20.6,9 c-8.3,3.5-16.6,6.9-24.8,10.4C404.4,130.7,396.1,134.2,387.2,138.1z M382.6,118.7c1.3-0.1,2.3,0,3.1-0.3 c14.3-6.1,28.6-12.3,42.9-18.4c4.3-1.8,4.6-3,1.3-6.1c-10.6-9.8-27.9-9.4-38.3,0.7C385.1,101.1,382.8,109.1,382.6,118.7z'/%3E%3Cpath class='st0' d='M750.5,147.8c5.2-2.5,9.8-4.8,14.5-6.9c5.3-2.3,7.3-1.5,10,3.5c3.6,6.7,9,11.4,15.9,14.5 c8,3.6,18.9-2.6,21.9-8.4c1.3-2.5,1-4.8-0.4-7.1c-3.1-5-7.9-7.5-13.2-9.2c-7.9-2.4-16-4.5-23.9-7c-17.3-5.5-25.6-21.8-20.5-39.2 c4.5-15.3,16.4-21.1,30.5-23.3c11.6-1.8,23.3-1.3,34.1,4.5c7.1,3.8,12.7,9.1,16.2,16.4c2.2,4.6,1.4,6.6-3.2,8.7 c-3.5,1.6-6.9,3.2-10.5,4.7c-4.3,1.7-6.5,0.9-9.1-3c-7.3-10.7-22.5-14.9-32.3-3.6c-2.8,3.2-2.7,6,0,9.2c4,4.9,9.9,5.8,15.3,7.6 c8.2,2.6,16.7,4.7,24.6,8c10.6,4.4,16.9,12.7,18.1,24.4c1.3,13-2.2,24-13.5,31.7c-12.8,8.6-26.9,9.9-41.5,6.8 c-15.6-3.3-25.7-13.2-31.8-27.5C751,151.2,750.9,149.6,750.5,147.8z'/%3E%3Cpath class='st3' d='M326.1,67.3c8.8,0,17.1,0,25.8,0c0.2,6.9,0.5,13.3,0.4,19.7c0,0.7-2.5,1.8-3.9,1.9c-7.2,0.2-14.3,0.1-22.1,0.1 c0,29.3,0,58.5,0,88.2c-8.3,0-16.1,0-24.3,0c-0.2-1.5-0.6-3.1-0.6-4.7c0-26.5-0.1-53,0-79.5c0-3.5-1.3-4.4-4.4-4.1 c-3.2,0.2-6.3,0-9.5,0.1c-2.9,0.1-4.4-0.7-4.2-3.9c0.2-4.7,0.2-9.3,0-14c-0.1-3.2,1.3-4.1,4.2-3.9c3.3,0.2,6.7-0.1,10,0.1 c3.2,0.2,3.8-1.2,4-4.1c0.4-7.6,0.6-15.3,1.9-22.8c1.8-10.1,13.1-23.1,28.3-23.4c5.8-0.1,11.6,0.1,17.4,0.2c1.1,0,2.4,0.3,3.4,0.7 c5.8,2.6,6.6,2.4,4.3,8.6c-1.4,3.7-2,7.7-3.2,11.5c-1,3.4-3,4.4-6.5,3.3c-0.2,0-0.3-0.1-0.5-0.2c-11.3-4.1-19.7,1.3-20.5,13.4 C325.8,58.4,326.1,62.4,326.1,67.3z'/%3E%3Cpath class='st3' d='M709.3,67.3c7.3,0,13.7,0.1,20.2,0c3,0,3.5,1.7,3.5,4.2c-0.1,7.5-0.1,15-0.1,22.5c0,26.3,0.1,52.6,0.1,78.9 c0,4.5-0.3,4.8-4.7,4.9c-5.3,0-10.7-0.1-16-0.1c-2.7,0-3.8-1.3-3.7-4.1c0.3-5.5,0.5-11,0.5-16.4c0-28.1-0.1-56.3-0.1-84.4 C709,71.1,709.1,69.5,709.3,67.3z'/%3E%3Cpath class='st3' d='M705.4,32.1c0-10.7,4.8-15.5,15.3-15.7c13.3-0.2,16.2,7.9,16.4,15.6c0.2,11.6-6.7,16.7-16.7,16.2 C710,47.7,705.4,43.2,705.4,32.1z'/%3E%3C/g%3E%3C/svg%3E%0A");*/
}
main{
	margin-top: 30px;
}
section {
	display:block;
    min-width: 300px;
	font-size: 14px;
	text-align: center;
	border-radius: 3px;
	margin:0 auto;
	font-size:0px;
}
section span{
    display: block;
}
section .search-input {
	height: auto;
	width:600px;
	height: 51px;
    line-height: 51px;
	padding: 0px 20px 0 55px;
	margin:0px 0px 30px 0px;
	vertical-align: top;
	border-radius: 100px;
	transition: box-shadow 200ms cubic-bezier(0.4, 0.0, 0.2, 1);
	font-size: 20px;
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8' standalone='no' %3F%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' width='20' height='20' viewBox='0 0 20 20' xml:space='preserve'%3E%3Cdesc%3ECreated with Fabric.js 3.6.6%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg transform='matrix(1.08 0 0 1.08 10 10)' %3E%3Cpath style='stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(154,160,166); fill-rule: nonzero; opacity: 1;' transform=' translate(-11.74, -11.75)' d='M 15.5 14 h -0.79 l -0.28 -0.27 A 6.471 6.471 0 0 0 16 9.5 A 6.5 6.5 0 1 0 9.5 16 c 1.61 0 3.09 -0.59 4.23 -1.57 l 0.27 0.28 v 0.79 l 5 4.99 L 20.49 19 l -4.99 -5 z m -6 0 C 7.01 14 5 11.99 5 9.5 S 7.01 5 9.5 5 S 14 7.01 14 9.5 S 11.99 14 9.5 14 z' stroke-linecap='round' /%3E%3C/g%3E%3C/svg%3E");
    background-position: 20px 16px;
    background-repeat: no-repeat;
    color: #9aa0a6;
}
section .search-input:hover, section .search-input:focus {

}
section .search-button.large, section .lucky-button {
    -moz-user-select: none;
    border-radius: 4px;
    cursor: default;
    font-size: 14px;
    margin: 0px 8px;
    min-width: 54px;
    padding: 10px 20px;
    text-align: center;
	line-height: 27px;
    cursor: pointer;
    user-select: none;
}
section .search-button.small {
	display: none;
}
section .search-button.small .ico {
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8' standalone='no' %3F%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' width='20' height='20' viewBox='0 0 20 20' xml:space='preserve'%3E%3Cdesc%3ECreated with Fabric.js 3.6.6%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg transform='matrix(1.08 0 0 1.08 10 10)' %3E%3Cpath style='stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(154,160,166); fill-rule: nonzero; opacity: 1;' transform=' translate(-11.74, -11.75)' d='M 15.5 14 h -0.79 l -0.28 -0.27 A 6.471 6.471 0 0 0 16 9.5 A 6.5 6.5 0 1 0 9.5 16 c 1.61 0 3.09 -0.59 4.23 -1.57 l 0.27 0.28 v 0.79 l 5 4.99 L 20.49 19 l -4.99 -5 z m -6 0 C 7.01 14 5 11.99 5 9.5 S 7.01 5 9.5 5 S 14 7.01 14 9.5 S 11.99 14 9.5 14 z' stroke-linecap='round' /%3E%3C/g%3E%3C/svg%3E");
    background-size: 15px;
    height: 15px;
    margin: auto;
    width: 15px;
}
section .search-form {
	display: inline;
	padding:0px;
	margin:0px;
}
.more-info {
	font-size: 13px;
    line-height: 1.6em;
    margin-top: 40px;
}
.more-info a{
	text-decoration: none;
}
.more-info a:hover{
	text-decoration: underline;
}
.footer {
	position:fixed;
    bottom: 0;
    left: 0;
    right: 0;
	width:100%;
	padding:0px;
}
.footer .wrapper{
    text-align: center;
    padding:20px 30px;
}
.footer a{
	text-decoration:none;
    font-size: 13px;
}
.footer a:hover{
	text-decoration:underline;
}

@media only screen and (max-width: 700px) {	
	header {
		width:100%;
		height:60px;
	}
	section {
		width:100%;
		height:100px;
	}
	section span{
		display: inline;
	}
	section .search-input {
        display: inline;
        width: 50%;
		box-shadow:none;
		border-radius: 100px 0 0 100px;
		border-right: none;
		border-top: 1px solid silver;
		height:48px;
		font-size:24px;
		line-height:24px;
        background-image: none;
        padding-left: 25px;
	}	
	section .search-button,  section .lucky-button{
		display:none;
	}	
	section .search-button.small {
		display:inline;
		border-radius: 0 100px 100px 0;
		padding: 0;
		box-sizing: border-box;
		height: 50px;
		width: 60px;
        margin-left: -1px;
	}
    .more-info {
        margin-top: 0px;
    }

}

@media (prefers-color-scheme: light) {
    
    body {
        background: #FFF;
        color: #333;
    }
    header .logo{
        background-image: url(../immagini/logo/defeudis.png);
    }
    section {
        background: #fff;
        color: #555;
    }
    section .search-input {
        border:1px solid #dfe1e5;
        background-color: #fff;
        color: #333;
    }
    section:hover .search-input, section:focus .search-input,
    section:hover .search-button.small, section:focus .search-button.small{
        border:1px solid #ccc;
        /*box-shadow: 0 1px 6px rgba(32,33,36,0.2);*/
    }
    section .search-button.large, section .lucky-button {
        background-color: #f2f2f2;
        border: 1px solid #f2f2f2;
        color: #757575;
    }
    section .search-button.large:hover, section .lucky-button:hover {
        background-color: #f8f8f8;
        background-image: linear-gradient(top,#f8f8f8,#f1f1f1);
        border: 1px solid #c6c6c6;
        box-shadow: 0 1px 1px rgba(0,0,0,0.1);
        color: #222;
    }
	section .search-button.small {
		background-color: #dfe1e5;
		border: 1px solid #dfe1e5;
    }
    .more-info{
        color: #999;
    }
    .more-info a {
        color: #999;
    }
    .footer {
        background-color:#F2F2F2;
        border-top:1px solid #E4E4E4;
        color: #777;
    }
    .footer a{
        color: #777;
    }    
    
}

@media (prefers-color-scheme: dark) {
    
    body, section {
        background: #202124;
        color: #FFF;
    }
    header .logo{
        background-image: url(../immagini/logo/defeudis_w.png);
    }
    section {
        background: #202124;
        color: #555;
    }
    section .search-input {
        border: 1px solid #303134;
        background-color: #202124;
        color: #e8eaed;
    }
    section:hover .search-input, section:focus .search-input,
    section:hover .search-button.small, section:focus .search-button.small{
        border: 1px solid #303134;
        /*box-shadow: 0 1px 6px rgba(0,0,0,0.3);*/
        background-color: #303134;
    }
    section .search-button.large, section .lucky-button {
        background-color: #303134;
        border: 1px solid #303134;
        color: #e8eaed;
    }
    section .search-button.large:hover, section .lucky-button:hover {
        background-color: #303134;
        border: 1px solid #5f6368;
        box-shadow: 0 1px 1px rgba(0,0,0,0.1);
    }
	section .search-button.small {
		background-color: #303134;
		border: none;
    }
    .more-info{
        color: #666;
    }
    .more-info a {
        color: #999;
    }
    .footer {
        background-color:#171717;
        border-top:1px solid #3c4043;
        color: #777;
    }
    .footer a{
        color: #777;
    }
    
}