* {

    padding: 0;

    margin: 0;

    box-sizing: border-box;

    font-family: sans-serif;

    text-decoration: none;

    list-style: none;

  }

  

  a{

    text-decoration: none;

    color: inherit;

  }



  .wrapper a:hover{

    text-decoration: underline;

  }



  .header {

    position: sticky;

    top: 0;

    width: 100%;

    box-shadow: 0 4px 20px hsla(207, 24%, 35%, 0.1);

    background-color: #151418;

    z-index: 1;

  }

  

  nav {

    display: flex;

    justify-content: space-between;

    align-items: center;

    padding: 20px 30px;

  }

  

  .logo a {

    font-size: 24px;

    font-weight: bold;

    color: #fff;

  }

  

  .logo a span {

    color: #8739fa;

  }

  

  .menu {

    display: flex;

    justify-content: center;

    align-items: center;

  }

  

  .menu a {

    display: block;

    padding: 7px 15px;

    font-size: 17px;

    font-weight: 500;

    transition: 0.2s all ease-in-out;

    color: #fff;

  }

  

  .menu:hover a {

    opacity: 0.4;

  }

  

  .menu a:hover {

    opacity: 1;

    color: #fff;

  }

  

  .menu-icon {

    display: none;

  }

  

  #menu-toggle {

    display: none;

  }

  

  #menu-toggle:checked ~ .menu {

    transform: scale(1, 1);

  }

  

  @media only screen and (max-width: 950px) {

    .menu {

      flex-direction: column;

      background-color: #151418;

      align-items: start;

      position: absolute;

      top: 70px;

      left: 0;

      width: 100%;

      z-index: 1;

      transform: scale(1, 0);

      transform-origin: top;

      transition: transform 0.3s ease-in-out;

      box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;

    }

  

    .menu a {

      margin-left: 12px;

    }

  

    .menu li {

      margin-bottom: 10px;

    }

  

    .menu-icon {

      display: block;

      color: #fff;

      font-size: 28px;

      cursor: pointer;

    }

  }



  /*3 column responsive layout*/



  @import url(https://fonts.googleapis.com/css?family=Open+Sans);



* { box-sizing: border-box; }





/* STRUCTURE */



.wrapper {

	padding: 5px;

	max-width: 1200px;

	width: 95%;

	margin: 0px auto;

}

header {

	padding: 0 15px;

}



.columns {

	display: flex;

	flex-flow: row wrap;

	justify-content: center;

	margin: 5px 0;

}



.column {

	/*flex: 1;*/
  width: 33%;
	border: none;

	margin: 2px;

	padding: 10px;

	&:first-child { margin-left: 0; }

	&:last-child { margin-right: 0; }

	

}



footer {

	padding: 0 15px;

}





@media screen and (max-width: 980px) {

  .columns .column {

		margin-bottom: 5px;

    flex-basis: 40%;

		&:nth-last-child(2) {

			margin-right: 0;

		}

		&:last-child {

			flex-basis: 100%;

			margin: 0;

		}

	}

}



@media screen and (max-width: 680px) {

	.columns .column {

		flex-basis: 100%;

		margin: 0 0 5px 0;

	}

}



h3{

  font-weight: normal;

  padding: 10px 0px 10px 0px;

  color: #4f5bd5;

}



h1{

  padding-top: 10px;

  padding-bottom: 0px;

}



p{

  padding-top: 10px;

}



.footer{

  background-color: #151418;

  color: white;

  text-align: center;

  font-size: 15px;

  padding: 10px;

}



.blog_content{

  text-align: left;

  font-size: 17px;

  padding: 10px;

}



/*scroll to top*/

#btn-back-to-top {

  position: fixed;

  bottom: 20px;

  right: 20px;

  display: none;

}



/*Form*/



.frm input[type=text]{

  width: 500px;

  height: 40px;

  font-size: 17px;

  margin-top: 10px;

  border-radius: 5px;

  padding: 10px;

  border: 1px solid black;

}



.frm textarea{

  width: 500px;

  font-size: 17px;

  margin-top: 10px;

  padding: 10px;

  border-radius: 5px;

  border: 1px solid black;

}



.frm{

  padding: 10px;

  max-width: 700px;

  text-align: left;

}



.submit_btn{

  width: 250px;

  background-color: #1f2123;

  height: 40px;

  font-size: 20px;

  border: none;

  color: white;

}



.cbox{

  font-size: 12px;

}



.frm input[type=checkbox]{

  width: 20px;

  height: 10px;

}



.wd{

  background-color: #1f2123;

  margin: 0px;

  width: 70%;

  margin: auto;

}



.socl{

  text-align: right !important;

}

.socl img{

  width: 5%;

  margin-left: 5px;

}

@media(max-width:900px)

{

  .socl img{width: 10%;}

}



@media (max-width:900px){

  .socl{

    text-align: center !important;

  } 

}



.ml-25{

  margin-left: 25%;

}



@media (max-width:900px){

  .ml-25{

    margin-left: 0%;

  }

}



.read{

  color: blue;

}





/*To resize the columns temporary*/

.col-temp{

  visibility: hidden;

}



@media (max-width:750px){

  .col-temp{

    display: none;

  }

}

/**/


/*
  edited
*/

  
.flex {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
.content {
  width: 33%;
  height: 500px;
  padding: 10px;
  display: none;
}
#loadMore {
  width: 200px;
  color: #fff;
  display: block;
  text-align: center;
  margin: 20px auto;
  font-weight: bold;
  padding: 10px;
  border-radius: 10px;
  border: 1px solid transparent;
  background-color: #c52249;
  transition: .3s;
}
#loadMore:hover {
  color: #c52249;
  background-color: #fff;
  border: 1px solid #c52249;
  text-decoration: none;
}
.container{
    margin: auto;
    max-width:1200px
}

.top{
    width: 200px;
  color: #fff;
  display: block;
  text-align: center;
  margin: 20px auto;
  padding: 10px;
  border-radius: 10px;
  border: 1px solid transparent;
  background-color: #c52249;
  font-weight: bold;
  transition: .3s;
}
.top:hover {
  color: #c52249;
  background-color: #fff;
  border: 1px solid #c52249;
  text-decoration: none;
}