/* FONT */
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
:root{--font-family: 'Roboto', sans-serif;--brand-color: #CEFF00;}

/* NORMALIZE THE PAGE */
html, body{width: 100%;height: 100%;padding: 0;margin: 0;font-family: var(--font-family);background: #f5f5f5}

/* INPUT */
button, input, select, textarea, label{position: relative;float:left;border: none;border-radius: 0;outline: none;-webkit-box-shadow: none;box-shadow: none;padding: 0;margin:0;-webkit-appearance: none;-moz-appearance: none;appearance: none;font-family: var(--font-family);background: none;}

/* H1,H2,H3,H4,H5,H6 */
h1, h2, h3, h4, h5, h6{margin: 0;font-size: unset;}
h1{font-weight: 500;}

/* ELEMENT */
div{position: relative;float: left;}

/* TEXT */
.title{font-size: 40px;line-height: 50px;font-weight: bold;}
.subtitle{font-size: 30px;line-height: 35px;}
.text{font-size: 20px;line-height: 20px;}

/* POSITION */
.p-r{position: relative;float: left;}
.p-f{position: fixed;float: left;}
.p-a{position: absolute;float: left;}

/* DISTANCE */
.m-0{margin: 0;}
.p-0{padding: 0;}

/* BACKGROUND IMAGE */
div.bg-img{background-size:cover;background-color:#ccc;background-position:center;background-repeat:no-repeat;}
div.bg-img-f{position:absolute;top:0;left:0;width:100%;height:100%;background-size:cover;background-color:#ccc;background-position:center;background-repeat:no-repeat;background-attachment: fixed;}

@media (max-width: 768px){
div.bg-img-f{background-attachment: unset;}
}