html, body ,.bg,.black
{
  height: 100%; 
  font-family: 'Tajawal';
  color:#eee;
}

.bg
{
	background-attachment:fixed;
	background-size:cover;
	overflow:auto;
}

.black
{
	background-color: rgba(10, 10, 10, 0.2);
	overflow:auto;
}



header
{
  display: flex;
  align-items: center;
  margin-bottom: 30px;
  border-bottom: 4px solid #eee;
  padding-bottom: 10px;
  justify-content: space-evenly;
}


#heading 
{
  background-color: #2980b9;
  padding: 0px 0 0 10px;
  border-radius: 10px;
  font-family: 'Raleway';
  display: inline-block;
  color: #eee;
}

#heading h3
{
	margin: 5px;
}



#heading span
{
     background-color: #eee;
    padding: 0 10px;
    margin: 0 5px;
    border-radius: 10px;
    color: #2980b9;
}


#head-title
{
	color:#eee;
  font-size: 40px;
  text-shadow: 1px 1px #aaa;
}

.menu
{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
  align-content: space-around;
}

.element i
{
	padding-bottom:20px;
}

.element
{
  width: 27%;
  min-height: 20%;
  margin: 0 5px 10px 5px;
  padding: 30px 5px;
  border: 4px solid #eee;
  color: #eee;
  border-radius: 5px;
  position: relative;
  transition: all 0.5s ease;
  font-size: 10px;
      display: flex;
    justify-content: center;
    align-items: center;
}

.element h2
{
  font-size:4.5vw;
}

@media (min-width:1000px) {
  .element h2
  {
    font-size:200%;
  }
}

.element a
{
  color:#eee;
}


.element::after
{
  content: "";
  display: block;
  position: absolute;
  bottom: -1px;
  right: 0;
  height: 0px;
  width: 0px;
  background-color: #eee;
  border-radius: 5px 0 0 0;
  margin: 0;
  transition: all 0.2s ease;
}

.element:hover::after
{
  height: 20px;
  width: 20px;
}

.website
{
  background-color:#2ecc71;
}

.twitter
{
  background-color:#3498db;
}

.insta
{
  background:linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
}

.snap
{
  background-color:#f1c40f;
}

.phone
{
  background-color:#e74c3c;
}


.mail
{
  background-color:#706fd3;
}

.map
{
  background-color:#222;
}

.whatsapp
{
  background-color:var(--green);
}

.map a
{
  color:#eee;
}

.telegram
{
  background-color:var(--primary);
}

.pinterest
{
  background-color:#dc3545;
}