================ */
#icon-home {
color: #FFFFFF;
}
#icon-1 {
color: #DC5350;
}
#icon-2 {
color: #F07B30;
}
#icon-3 {
color: #F9D246;
}
#icon-4 {
color: #5DB862;
}
#icon-5 {
color: #3795CF;
}
#icon-6 {
color: #842FC4;
}
/* ===============
TOGGLE ICONS


================ */
#menu {
	background-image: url(/resources/background_7.jpg);
}
#topbar {
	background-image: url(/resources/background_7.jpg);
}
#sidebar {
	background-image: url(/resources/background_7.jpg);
	background-attachment: fixed;
	background-position: right top;
}
#content {
}
#footer {
}
/* ===============

/* common styles !!! YOU DON'T NEED THEM */
.container {
  margin: 18px auto 0px auto;
  text-align: center;
}

.effect {
  width: 100%;
  padding: 0px 20px 20px 20px;
}

.effect .buttons {
  margin-top: 0px;
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
          justify-content: center;
}

/* styles for a common effect !!!YOU NEED THEM */
.effect {
/*  display: flex; */
}
.effect a {
  text-decoration: none !important;
  width: 44px;
  height: 44px;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
          align-items: center;
  -webkit-box-pack: center;
          justify-content: center;
  border-radius: 50%;
  margin-right: 20px;
  font-size: 25px;
  overflow: hidden;
  position: relative;
  color: #e6e6e6;
  border: 2px solid #d9d9d9;
}
.effect a i {
  position: relative;
  z-index: 3;
}
.effect a:last-child {
  margin-right: 0px;
}
.effect a:before {
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}
.effect a i {
  display: inline-block;
  vertical-align: middle;
}

/* thurio effect */
.effect.thurio a {
  -webkit-transition: border-radius 0.2s linear 0s;
  transition: border-radius 0.2s linear 0s;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}
.effect.thurio a i {
  -webkit-transition: -webkit-transform 0.01s linear 0s;
  transition: -webkit-transform 0.01s linear 0s;
  transition: transform 0.01s linear 0s;
  transition: transform 0.01s linear 0s, -webkit-transform 0.01s linear 0s;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);

}
.effect.thurio a:hover {
  border-radius: 0px;


}