#shouts,body{background:#f4f4f4}#input,*{padding:0}#footer,.error{display:block;text-align:center}#footer,.error,header h1{text-align:center}#footer p,*{margin:0}body{font-family:Roboto,Arial,sans-serif;font-size:15px;line-height:1.5em}#container{background:#333;margin:50px auto;overflow:auto;width:60%;min-height:600px}header h1{color:#fff;padding:15px 0 10px 10px;border-bottom:1px solid #fff;letter-spacing:.2rem}#shouts{width:90%;height:400px;margin:20px auto;overflow:auto}.shout{list-style:none;padding:8px;border-bottom:1px dotted #ccc}.shout span{color:#aaa}#input{width:90%;min-height:80px;margin:auto}input[type=text]{height:25px;width:47%;padding:3px;margin-bottom:20px;border:1px solid #666;display:inline}input[type=text]:nth-of-type(2n){float:right}input.error{background:#fff}input.shout-btn{padding:5px;width:100%;margin:10px auto;cursor:pointer}.error{background:red;color:#fff;padding:5px;margin-bottom:20px}#footer{margin-top:20px;color:#fff;padding:10px;background:#333}#footer p a:link,a:visited{text-decoration:underline;color:#fff}#footer p a:hover{text-decoration:none}#footer p a:active{text-decoration:underline}.footer-social a:active .footer-icon{color:#696969}.footer-social a:link .footer-icon,.footer-social a:visited .footer-icon{color:#fff;font-size:2em;padding:10px}.footer-social a:hover .footer-icon{color:grey;background-color:#fff}i.footer-icon.fab.fa-linkedin{margin-left:15px}@media only screen and (max-width:768px){#container{width:80%;min-height:490px}header h1{line-height:2rem}#shouts{height:200px}#input input[type=text]{width:98%}}@media only screen and (max-width:480px){.footer-social{display:block}}@media only screen and (max-width:320px){.footer-social a:link .footer-icon,.footer-social a:visited .footer-icon{padding:15px}#footer a.footer_mobile{display:block}}