/**
* @package CSS Magic Extension
* @copyright (c) 2015 martin - http://www.martins-homelinux.net
* @license http://opensource.org/licenses/gpl-license.php GNU Public License
---------------------------------------------------------------------------- */

/*
--------------------------------------------------------------
Topic title hover start
-------------------------------------------------------------- */
a.forumtitle:hover {
     color: #FE0202;
     text-decoration: none;
     padding-left: 20px;
     transition: all 0.75s linear 0s;
}

a.topictitle:hover {
     color: #FE0202;
     text-decoration: none;
     padding-left: 20px;
     transition: all 0.75s linear 0s;
}
/*
-------------------------------------------------------------- */

/*
--------------------------------------------------------------
forabg image if you use one  start
-------------------------------------------------------------- */
.forumbg .header a:hover, .forabg .header a:hover, th a:hover {
	color: #ffcc00;
	-webkit-transform: scale(1.2); 
	-moz-transform: scale(1.2); 
	-o-transform: scale(1.2); 
	-ms-transform: scale(1.2); 
	transform: scale(1.2); 
}
/*
-------------------------------------------------------------- */

/*
--------------------------------------------------------------
Colours and backgrounds for content.css start
-------------------------------------------------------------- */

ul.forums {
	background-color: #eef5f9;
	background-image: url("./images/gradient.gif");
        border-radius: 6px; 
        -moz-border-radius: 6px; 
        -webkit-border-radius: 6px;
}

ul.topiclist li {
	color: #4C5D77;
        border-radius: 6px; 
        -moz-border-radius: 6px; 
        -webkit-border-radius: 6px;
}
/*
-------------------------------------------------------------- */

/*
--------------------------------------------------------------
If mchat installed then give it css why not ? lets  start
-------------------------------------------------------------- */

#mchat-panel {
	text-align: center;
	max-height: initial;
	padding: 0 5px 5px 5px;
	margin: 0;
	-webkit-border-radius: 6px;
    -o-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}

/* .mChatAvatars {
	float: left;
	padding-right: 5px;
} */

.mchat-avatar {
	float: left;
	padding-right: 5px;
	position: relative;
	display: inline-block;
	width: 40px;
	height: 40px;
	margin-bottom: 2px;
	vertical-align: middle;
	
}

.mchat-avatar img {
	position: absolute;
	-moz-transition: all 1s ease;
	-webkit-transition: all 1s ease;
	left: 0px;
	top: 0px;
	max-height: 35px;
	max-width: 35px;
    -webkit-border-radius: 6px;
    -o-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
	opacity: 1;
}

.mchat-avatar img:hover {
  animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
  perspective: 1000px;
}

@keyframes shake {
  10%, 90% {
    transform: translate3d(-1px, 0, 0);
  }
  
  20%, 80% {
    transform: translate3d(2px, 0, 0);
  }

  30%, 50%, 70% {
    transform: translate3d(-4px, 0, 0);
  }

  40%, 60% {
    transform: translate3d(4px, 0, 0);
  }
}
/*
-------------------------------------------------------------- */

/*
--------------------------------------------------------------
Lets have a go at them avatars ? lets  start
-------------------------------------------------------------- */
.postprofile .has-avatar .avatar-container {
   margin-bottom: 3px;

}

.postprofile .avatar {
   display: block;
   float: left;
   max-width: 100%;

}

.postprofile .avatar img {

   display: block;
   -moz-transition: all 1s ease;
   -webkit-transition: all 1s ease;
   left: 0px;
   top: 0px;
   max-height: 60px;
   max-width: 60px;
   -webkit-border-radius: 6px;
   -o-border-radius: 6px;
   -moz-border-radius: 6px;
   border-radius: 6px;
}

.postprofile .avatar img:hover {

   left: -40px;
   top: -40px;
   max-height:140px;
   max-width:140px;
   box-shadow: 0 0 20px #000;
   z-index: 10;
   -webkit-border-radius: 6px;
   -o-border-radius: 6px;
   -moz-border-radius: 6px;
   border-radius: 6px;
}
/*
-------------------------------------------------------------- */

/*
--------------------------------------------------------------
Lets shake them forum icons if you use them
-------------------------------------------------------------- */
.forum-image:hover {
  animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
  perspective: 1000px;
}

@keyframes shake {
  10%, 90% {
    transform: translate3d(-1px, 0, 0);
  }
  
  20%, 80% {
    transform: translate3d(2px, 0, 0);
  }

  30%, 50%, 70% {
    transform: translate3d(-4px, 0, 0);
  }

  40%, 60% {
    transform: translate3d(4px, 0, 0);
  }
}
/*
-------------------------------------------------------------- */





