/**
* @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;  By Caju */
/* 	background-image: url("./images/gradient.gif"); By Caju */
        border-radius: 0 0 6px 6px; /* By Caju: 6px */
        -moz-border-radius: 0 0 6px 6px; /* By Caju: 6px */
        -webkit-border-radius: 0 0 6px 6px; /* By Caju: 6px */
}

/* By Caju: pra tirar a borda arredondada na listagem dos subfóruns no index */
ul.topiclist.forums li.row {
        border-radius: 0;
        -moz-border-radius: 0;
        -webkit-border-radius: 0;
}

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; Commented by Caju */
	border-radius: 6px;
		-webkit-border-radius: 6px;
		-o-border-radius: 6px;
		-moz-border-radius: 6px;
	width: auto; /* By Caju: para o avatar manter o aspect ratio*/
	height: auto; /* By Caju: para o avatar manter o aspect ratio*/
}

.postprofile .avatar img:hover {

   left: -40px;
   top: -40px;
   max-height:90%; /* by Caju: max-height:140px; */
   max-width:90%; /* by Caju: max-width:140px; */
/*   box-shadow: 0 0 20px #000; Commented by Caju*/
   z-index: 10;
   -webkit-border-radius: 6px;
   -o-border-radius: 6px;
   -moz-border-radius: 6px;
   border-radius: 6px;
}


/* @media adicionado by Caju */
@media screen and (max-width: 400px){

	.postprofile .avatar img {
		max-height: 60px;
		max-width: 60px;
	}

}

/* @media adicionado by Caju */
@media screen and (min-width: 401px) and (max-width: 1034px){
	.postprofile .avatar img {
		max-height: 100px;
		max-width: 100px;
	}

}

/* @media adicionado by Caju */
@media screen and (min-width: 1035px){
	.postprofile .avatar img {
		max-height: 140px;
		max-width: 140px;
	}

}



/*
-------------------------------------------------------------- */

/*
--------------------------------------------------------------
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);
  }
}
/*
-------------------------------------------------------------- */




/**
*	Essa parte foi adicionada pelo Prof. Caju para imitar
*	o estilo do site dmzx-web.net no campo lastsubject
**/
a.lastsubject {
	font-weight: bold;
	text-decoration: none;
	background: #FFFFFF;
	padding: 0 6px;
	clear: both;
	border: solid 1px #999999;
	border-radius: 6px;
		-webkit-border-radius: 6px;
		-moz-border-radius: 6px;
	white-space: nowrap;
	text-overflow: ellipsis;
	max-width: 191px;
	display: inline-block;
	overflow: hidden;
}

@media(min-width:700px) and (max-width:900px){
	a.lastsubject {
		max-width: 127px !important;
	}
}