Coder Wrap provides free to use snippets

/**Typeo CSS Start**/
* {
 box-sizing: border-box;
}

body {
 margin: 0px;
}

ul, li, a {
 list-style: none;
 text-decoration: none;
 margin: 0px;
 padding: 0px;
}

img {
 max-width: 100%;
}

/**Typeo CSS End**/

/***Footer section start***/
.container {
 max-width: var(--page-width);
 width: 100%;
 margin: auto;
 padding: 0px 15px;
}

.footer-main, .footer-main * {
 --page-width: 1250px;
 --base-fm: 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
 --title-size: 24px;
 --base-size: 18px;
 --base-clr: #3f3f3f;
 --white-clr: #ffffff;
 --black-clr: #000000;
 --theme-clr: #05122d;
}

.footer-main {
 background-color: var(--theme-clr);
 color: var(--white-clr);
 width: 100%;
 font-family: var(--base-fm);
}

.ftr-top-inner {
 display: flex;
 flex-flow: row wrap;
 align-items: flex-start;
 width: calc(100% + 30px);
 padding-top: 80px;
 margin-left: -15px;
 padding-bottom: 80px;
}

.ftr-top-inner .ftr-item {
 width: 25%;
 padding: 0px 15px;
}

.ftr-tag {
 font-size: var(--base-size);
 max-width: 280px;
 display: inline-block;
}

.social-media {
 display: flex;
 flex-flow: row wrap;
 align-items: center;
 margin: 30px 0px 0px 0px;
 justify-content: flex-start;
}

.social-media li {
 margin: 5px 5px;
}

.social-media li a {
 width: 40px;
 height: 40px;
 background-color: #fff;
 display: flex;
 flex-flow: row wrap;
 align-items: center;
 justify-content: center;
 transition: 0.5s all;
}

.social-media li a img {
 max-width: 22px;
}

.social-media li a:hover {
 opacity: 0.8;
}

.ftr-top-inner .ftr-title {
 font-size: var(--title-size);
 font-weight: 600;
 width: 100%;
 margin-bottom: 10px;
 display: inline-block;
}

.ftr-menu li {
 width: 100%;
 margin: 6px 0;
 display: inline-block;
 font-size: var(--base-size);
}

.ftr-menu li a {
 color: var(--white-clr);
}

.ftr-menu li a:before {
 content: '';
 width: 6px;
 height: 6px;
 border-right: var(--white-clr) 2px solid;
 border-bottom: var(--white-clr) 2px solid;
 display: inline-block;
 margin-right: 8px;
 position: relative;
 transform: rotate(-45deg);
}

.ftr-menu li a:hover {
 text-decoration: underline;
}

.ftr-logo {
 max-width: 220px;
 margin-bottom: 20px;
}

.copy-scn {
 border-top: #ccc 1px solid;
 width: 100%;
 padding: 16px 0;
 font-size: calc(var(--base-size) - 2px);
}

.ftr-b-inner {
 display: flex;
 flex-flow: row wrap;
 justify-content: center;
 align-items: center;
 width: 100%;
 color: var(--white-clr);
}

.ftr-b-inner a {
 color: var(--white-clr);
 text-decoration: underline;
}

.ftr-b-inner a:hover {
 text-decoration: none;
}

.contact-info li {
 margin: 10px 0px;
}

.contact-info li a {
 display: block;
}

.contact-info li a:before {
 content: normal;
}

@media(max-width:1199px) {
 .ftr-menu li {
  font-size: 15px;
 }

 .ftr-top-inner .ftr-item {
  padding: 0px 10px;
 }

 .ftr-top-inner {
  width: calc(100% + 20px);
  margin-left: -10px;
 }

}

@media(max-width:992px) {
 .ftr-top-inner .ftr-item, .ftr-top-inner .ftr-item:nth-child(1) {
  width: 50%;
  margin-bottom: 25px;
 }

 .ftr-top-inner .ftr-title {
  margin-bottom: 0px;
 }

}

@media(max-width:767px) {
 .ftr-top-inner {
  padding-top: 30px;
  padding-bottom: 0px;
 }

 .ftr-top-inner .ftr-item, .ftr-top-inner .ftr-item:nth-child(1) {
  width: 100%;
 }

 .ftr-b-inner {
  text-align: center;
  line-height: 1.3;
  justify-content: center;
 }

}

/***Footer section end***/

var dynamicyear = new Date().getFullYear();
 document.getElementById('year').innerHTML = dynamicyear;