/* CS1 Фон и цвет текста*/

/* CS1.1 Цвет текста на форуме */
.punbb .section .container, .punbb .post-body, .punbb .post-links, .punbb td.tc2, .punbb td.tc3, #pun-navlinks .container,
.punbb .formal fieldset .post-box, #viewprofile li strong, #viewprofile li div, #setmods dd,
.punbb .info-box, .punbb #pun-main .info-box .legend, .punbb .main .container, .punbb .post .container, .punbb .post h3, .punbb-admin #pun-admain .adcontainer, #pun-stats h2, .punbb .main h1, .punbb .main h2, #pun-debug h2, .punbb-admin #pun-admain h2, #pun-title, #pun-title .container, .punbb .modmenu .container, .punbb legend span, #viewprofile h2 span, #profilenav h2 span, .punbb-admin #pun-admain legend span, .punbb .post h3 span, .punbb th, #viewprofile li, #setmods dl, #pun-navlinks .container  { background-color: transpanent;
color: #33231c;
font-weight: normal;
font-style: normal;}

/* CS1.2 Боди или фон форума */
body { background-color: #eaddce;  background-position: top left; background-repeat: repeat; background-image : url(); }

/* CS1.3 Шапка */
#pun-title table {
background-image : url(); 
background-repeat : no-repeat;
background-position: top center;
border: none;
  margin-left: -89px;
height: 444px;
width: 1008px;}

/* CS1.4 Пан или "тело" форума */
#pun {background-color: #f3e9ce; background-image: url();}


/* CS1.5 Футер\копирай\низ */
#pun-about p.container {background-image: url(http://sf.uploads.ru/N0zCg.png); background-position: bottom center; background-repeat: no-repeat; height: 100px; width:941px; margin: 10px 10px -40px -34px;}

BODY {overflow-x: hidden}

/* CS2 Ссылки */

/* CS2.1 */
.punbb a, .punbb a:link, .punbb a:visited,
.punbb-admin #pun-admain a, .punbb-admin #pun-admain a:link, .punbb-admin #punbb-admain a:visited, .punbb li.isactive a, .punbb li.isactive a:link, .punbb li.isactive a:visited {
  color: #924901;
  text-decoration: none;}

/* CS2.2 */
.punbb a:hover, .punbb a:focus, .punbb a:active,  .punbb-admin #pun-admain .nodefault,
.punbb-admin #punbb-admain a:hover, .punbb-admin #punbb-admain a:focus, .punbb-admin #punbb-admain a:active {
  color: #924901; 
  text-decoration: none;}

/* CS2.3 */
#pun-navlinks a {
  color: #924901;
  text-decoration: none;}

/* CS2.4 */
#pun-navlinks a:hover, #pun-navlinks a:focus, #pun-navlinks a:active {
  color: #924901;
  text-decoration: none;}

/* CS3 Иконки старых, новых, важных, закрытых тем */

/* CS3.1 Иконка старых сообщений*/
.punbb table Div.icon {float: left;
display: block; 
border-style: none none none none;
margin-top: 5px;
margin-left: 15px;
margin-right: 5px;
width: 56px;
height: 56px;
background-image : url(http://sf.uploads.ru/xXw1W.png);
background-repeat: no-repeat;}

/* CS3.2 Иконка новых */
TR.inew Div.icon {
background-image : url(http://sf.uploads.ru/G1jmK.png);
background-repeat: no-repeat;
width: 56px;
height: 56px;}

/* CS3.3 Иконка важных*/
TR.isticky Div.icon {
background-image : url(http://sf.uploads.ru/G1jmK.png);
background-repeat: no-repeat;
width: 56px;
height: 56px;}

/* CS3.3 Иконка закрытых*/
TR.iclosed Div.icon {
background-image : url(http://sf.uploads.ru/xXw1W.png);
background-repeat: no-repeat;
width: 56px;
height: 56px;}

/* CS4 Картинки категорий */
#pun-category1.category h2 {
background: url(http://sf.uploads.ru/P0UdI.png);
height: 155px;
width: 735px;
font-size:0 !important;
margin-left: 91px;}

#pun-category2.category h2 {
background: url(http://sf.uploads.ru/iI4wS.png);
height: 155px;
width: 735px;
font-size:0 !important;
margin-left: 91px;}

#pun-category3.category h2 {
background: url(http://sf.uploads.ru/aDw3X.png);
height: 155px;
width: 735px;
font-size:0 !important;
margin-left: 91px;}

#pun-category4.category h2 {
background: url(http://sf.uploads.ru/xyZQF.png);
height: 155px;
width: 735px;
font-size:0 !important;
margin-left: 91px;}

#pun-category5.category h2 {
background: url(http://sf.uploads.ru/mhKEz.png);
height: 155px;
width: 735px;
font-size:0 !important;
margin-left: 91px;}

#pun-category6.category h2 {
background: url(http://sf.uploads.ru/RPlAG.png);
height: 155px;
width: 735px;
font-size:0 !important;
margin-left: 91px;}

#pun-category7.category h2 {
background: url(http://sf.uploads.ru/iENIJ.png);
height: 155px;
width: 735px;
font-size:0 !important;
margin-left: 91px;}

/* CS5 Прочие элементы */

/* CS5.1 Статус картинки со статистикой 24*/
#pun-stats ul.container { 
background-attachment: scroll;
background-clip: border-box;
background-color: transparent;
background-image: url("http://sf.uploads.ru/PLiFW.png");
background-origin: padding-box;
background-position: 30px 10px;
background-repeat: no-repeat;
background-size: auto;
padding-left: 170px;
padding-top: 40px;}

/* CS5.2 Статус картинки с надписью "статистика" над статистикой форума*/
#pun-stats.section h2 { 
background-attachment: scroll;
background-clip: border-box;
height: 155px;
width: 735px;
margin-left: 91px;
background-color: transparent;
background-image: url("http://sf.uploads.ru/teRuE.png");
background-origin: padding-box;
background-position: 50% 0%;
background-repeat: no-repeat;
background-size: auto;
font-size: 0px;}

/* CS5.3 Цитаты и коды в сообщениях*/
.punbb .quote-box, .punbb .code-box {
padding-top:3px;
background: #f2e6c4;
border: double 3px #fe8a01;
}

li.pa-avatar.item2 img {margin-left:-2px; margin-top: -2px; border: double 3px #fa8400}

/* CS5.4 Область для ввода текста в форме ответа и админке */
.punbb textarea, .punbb select, .punbb input {
background-color: #f0ece0;
color: #000000}

/* CS5.5 Двигаем верхний баннер */
#pun-title table tbody tr .title-logo-tdr {
position: absolute; z-index: 1; 
left: 50px; 
top: -192px}

/* CS5.6 Совсем другое */
#pun-main div.catleft, #pun-main div.catright {display: none}
#pun-announcement .container {margin-top: -2em}
#pun-main .post-author ul {text-align: center}
#pun-announcement h2 {display: none}
#pun-status .container, #pun-main .post-links li {text-align: center;}
#pun th, #pun-main h2 {text-align: center}
#pun-crumbs1 .container { text-align: center;}
#pun-navlinks .container, #pun-ulinks .container { text-align: center;}
#pun-main .post-author ul, #pun-main .post .container { 
line-height: 14px;
margin-top: 15px;
}


/* кнопочки */

a.tvm, a.tvm:active, a.tvm:link, a.tvm:visited {
font-family: tahoma;
font-size: 12px;
background-color: #c1cad2;
color: #04001a; 
font-weight: normal;
text-align:center;
display: block;
margin: 1px;
text-decoration: none;
border-left-style: solid;
border-left-color: #7eb5a3;
border-left-width: 7px;
width: 100px;
}

a.tvm:hover {
font-family: tahoma;
font-size: 12px;
color: #04001a; 
background-color:#b5d6cc;
display: block;
font-weight: bold;
text-align:center;
cursor:crosshair; 
text-decoration: none;
border-left-style: solid;
border-left-color: #bcc8d0;
border-left-width: 7px;
width: 100px;
}


.tooltip {
	position: relative;
font-family: Kaushan Script;
font-size: 18px;
	}
.tooltip em {
	display: none;
	}
.tooltip:hover em {
	font-style: normal;
	display: block;
	position: absolute;
 	background-color: #c3d7df;
	color: #082567;
	padding: 8px 5px 5px 7px;
	bottom: 25px;
	right: -60px;
	box-shadow: 0 0 0px #ccc;
 	border-radius: 10px;
	-webkit-border-radius: 10px;
 	-moz-border-radius: 10px;
	-webkit-box-shadow: 0 0 0px #ccc;
	-moz-box-shadow: 0 0 0px #ccc;
}
.tooltip:hover em i {
	position: absolute;
	bottom: 17px;
	right: 25px;
	border-top: 3px solid #000;
	border-left: 3px solid transparent;
	display: block;
} 





.Myimge {
height: 40px;
width: 56px;
top: 0px; 
left: 810px;
position:absolute;
cursor:pointer;
}


/* оформление профиля */
.punbb .post .post-author {
  background:url(http://sf.uploads.ru/hsIU2.png) 0 0 repeat-y; 
  overflow: visible!important;
  margin: 12px 0!important;
}
.punbb .post .post-author > ul {
  background:url(http://sf.uploads.ru/91Xgk.png) 0 top no-repeat,url(http://sf.uploads.ru/KJaOB.png) 0 bottom no-repeat; 
  margin: -25px 0 -22px 0!important;
  padding: 40px 13px!important;
}
 .pa-time-visit {
font-size: 10px;
}

#pun-main .post-author ul, #pun-main .post .container { 
line-height: 14px;
margin-top: 15px;
}






#paginator {
  opacity: 0.9;
  position: absolute;
  left: 55px;
  z-index: 1000;
  filter: alpha(opacity=90);
  text-shadow: 0 1px 0 #000;
  background-color: #ddadaf; /* фон блока пагинатора */
  border: 2px solid #996666; /* цвет границы блока */
  table-layout: auto !important;
  width: auto !important;
  background-image: -webkit-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
  background-image: -moz-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
  background-image: -ms-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
  background-image: -o-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
  background-image: linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
  -moz-border-radius: 4px;
  border-radius: 4px;
  khtml-border-radius:4px;
  -webkit-border-radius:4px;
  -moz-box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset;
  -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset;
  box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset;
  text-shadow: 0 1px 0 rgba(255,255,255,.4);
}

#paginator td {
  padding: 0.1em;
  border-style: none;
}

#pnav:hover {
  background: #f0f2f5; /* фон цифры при наведении курсора */
  color: #92000a; /* цвет цифры при наведении курсора */
  -moz-border-radius: 9000em;
  border-radius: 9000em;
  khtml-border-radius:9000em;
  -webkit-border-radius:9000em;
}







/****************************************
 Mini-Profiles
*****************************************/

.position { position: relative; }



.groupblok {height: 40px; overflow:hidden; line-height: 40px;  margin-bottom: 5px; width: 480px; display: block; background-color: #abcdef; font-family: 'Comic Sans Ms', sans serif; font-size: 14px; text-align: center; color:  #120a8f; text-transform: uppercase; border-top: 1px solid #ccccff;}

.groupblok:hover{height: auto;  display:block;
    -webkit-transition:all 1.5s ease;
    -moz-transition:all 1.5s ease; } 

.groupblok1 {height: 30px; overflow:hidden; line-height: 40px;  margin-bottom: 5px; width: 190px; display: block; background-color: #abcdef; font-family: 'Comic Sans Ms', sans serif; font-size: 14px; text-align: center; color:  #120a8f; text-transform: uppercase; border-top: 1px solid #ccccff;}

.groupblok1:hover{height: auto;  display:block;
    -webkit-transition:all 1.5s ease;
    -moz-transition:all 1.5s ease; } 



.groupdesc { background-color: #f3fdcb; color: #310062; text-transform: none !important; text-align: justify; line-height: 1 !important; padding: 4px;  width: 460px; margin-left: -10px; height: auto;}

.groupdesc a {text-transform: uppercase; text-align: center; }

.groupdesc1 { background-color: #eedc82; color: #310062; text-transform: none !important; text-align: justify; line-height: 1 !important; padding: 4px;  width: 190px; margin-left: -10px; height: auto;}

.groupdesc1 a {text-transform: uppercase; text-align: center; }





#apptext { height: 395px; width: 313px; padding: 5px; text-align: justify; overflow-y: scroll; overflow-x: hidden; line-height: 150%; }

.apptitle { font-family: 'Special Elite', cursive; font-size: 22px; }

.msg-normal table .row4 .normalname { display: inherit; }

 ::-webkit-scrollbar-thumb:vertical { background-color: #8281a1;}
 ::-webkit-scrollbar-thumb:horizontal { background-color: #8281a1;}
 ::-webkit-scrollbar {height: 10px;
 width: 7px;
 background-color: #2e2e48;}

.walkthrough { width: 70%; border: 4px solid #0a0a0a; margin: 0 auto; padding: 10px; background: url(http://crypsis.b1.jcink.com/uploads/crypsis/ectoplasm/black_gradient_pattern2.png); background-repeat: no-repeat; background-color: #0A0A0A; font-family: Georgia; font-size: 12px; text-shadow: none; color: #bece52; }

.walkthrough img { max-width: 100%; height: auto; }

.walktitle { font-family: 'Special Elite', cursive; font-size: 45px; text-shadow: 1px 1px 1px #000000; padding: 5px; margin-top: 20px;}

.jumplinks { width: 250px; border:  4px solid #0a0a0a; padding: 12px; margin: 0 auto; position: relative;}

.jumplinks a { display: block; padding: 5px; background-color: #0a0a0a; margin-bottom: 1px; opacity: 0.8; text-transform: uppercase; border-left: 5px solid #2a2a2a; text-align: center; font-family: 'Tahoma', sans serif; font-size: 10px;}

.jumplinks a:hover {opacity: 1; text-transform: lowercase;} 

.jumplinkstitle { background-color:  #0a0a0a; width: 250px; padding-left: 12px; padding-right: 12px; margin: 0 auto; border:  4px solid #0a0a0a; font-family: 'Tahoma', sans serif; font-size: 10px; text-align: center; color:  #F2F2F0; text-transform: uppercase;}

.claim { width: 400px; border:  4px solid #0a0a0a; text-align: justify; margin: 0 auto; padding: 10px; background: url(http://crypsis.b1.jcink.com/uploads/crypsis/ectoplasm/black_gradient_pattern2.png); background-repeat: no-repeat; background-color: #0A0A0A; font-family: Georgia; font-size: 12px; text-shadow: none; color: #999; }

.female { display: block; padding: 5px; margin-bottom: 1px; opacity: 0.8; background-color: #1d0c17; text-align: center; font-family: 'Tahoma', sans serif; font-size: 12px !important; text-shadow: 1px 1px 1px #000000; color: #d498bf;}

.male { display: block; padding: 5px; margin-bottom: 1px; opacity: 0.8; uppercase; background-color: #0c131d; text-align: center; font-family: 'Tahoma', sans serif; font-size: 12px !important; text-shadow: 1px 1px 1px #000000; color: #8ba8cf; }

.claimtitle { font-family: 'Special Elite', cursive; font-size: 45px; text-shadow: 1px 1px 1px #000000; margin: 0 auto; width: 400px; text-align: right; color: #fff;}


.unclaimed { display: block; padding: 5px; margin-bottom: 1px; opacity: 0.8; uppercase; background-color: #222; text-align: center; font-family: 'Tahoma', sans serif; font-size: 12px !important; text-shadow: 1px 1px 1px #000000;}










#tempcon1 { width: 400px; text-align: justify; font-size: 10px; font-family: calibri, sans-serif; line-height: 90%; color: #222; background-image: url(http://media.tumblr.com/tumblr_mbswsqf9Ey1qh9yw5.png); background-color: #fff; border-radius: 100px 10px 100px 10px; -moz-border-radius: 100px 10px 100px 10px; -webkit-border-radius: 100px 10px 100px 10px; -ms-border-radius: 100px 10px 100px 10px; -o-border-radius: 100px 10px 100px 10px;} #tempcon2 { background-image: url(http://media.tumblr.com/tumblr_mbswsqf9Ey1qh9yw5.png); background-color: #fff; padding: 20px; border-radius: 100px 10px 100px 10px; -moz-border-radius: 100px 10px 100px 10px; -webkit-border-radius: 100px 10px 100px 10px; -ms-border-radius: 100px 10px 100px 10px; -o-border-radius: 100px 10px 100px 10px;} .tempwords { padding: 20px; font-size: 10px; text-align: justify; background-color: #fff; box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4); -moz-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4); -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4); -ms-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4); -o-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4);} .tempwords:first-letter {float: left; font-family: grand hotel; color: #6f5992; text-shadow: 1px 1px 0px white, 2px 2px 0px #1d0f23; font-size: 40px; text-transform: lowercase; margin-right: 15px; margin-bottom: 1px;} .tempwords b {color: #6f5992; text-transform: uppercase;} .tempheader {font-family: arial; text-transform: uppercase; font-size: 8px; letter-spacing: 2px; background-color: #6f5992; padding: 20px; color: #FFF; font-style: italic; border-bottom: 10px solid #b1a7c1; }




<style>
.intd .tclcon .modlist{
display: none;
}
</style>





/* --- FACE CLAIMS --- */

.claimstitle { width:160px; padding-top:25px; padding-bottom:25px; padding-left: 10px; background-color:#363636; font-family:' Calibri, serif'; font-size:15px; color:#A8A7A7; text-transform:uppercase; text-align:center; font-weight:lighter; letter-spacing:8px; }
.claims2 {position: absolute; left: 45px;}
.claims2 a { width: 161px; left: 5px; display: block;  position: relative; color: #000000; height: 11px; margin-top: 8px; overflow: hidden; font-family:  Calibri, serif; font-size: 11px; line-height: 100%; }
.claims2 pb { position: absolute; top: 0px; left: 0px; width: 161px; text-align: center;}
.claims2 character { position: absolute; top: 0px; right: -169px; width: 161px; text-align: center; }
.claims2 a:hover pb { left: -169px; }
.claims2 a:hover character { right: 0px; }
.facetitle2{text-align:center; font-family:  Calibri, serif; font-size: 30px; letter-spacing: -1px; color: #000000; line-height: 96%;font-weight:body; background-color:#A1D6C4;}
.claiminfo2 {width:400px;background-color:#fff;border:double #211924;font-family:calibri;font-size:12px;text-align:justify;line-height:100%;padding:10px;}


.tabbclaimss { position: relative; width: 450px; height:400px; clear: both; }

.claims22 { position: absolute;
top: 50px;
bottom: 0px;
left: 0px;
right: 0px;
background: white;
width: 400px;
height: 300px;
OVERFLOW: AUTO;
font-family:  Calibri, serif; 
font-size: 11px; 
letter-spacing: 1px;
text-align:justify;
padding: 20px; }

.tabbclaim  { float:left; }
.tabbclaim label {display:block; 
width: 400px;
background: #333; 
color: #fff;
font-family:  Calibri, serif;
font-size: 9px;
text-transform: uppercase;
line-height: 100%;
padding: 19px; 
position: relative;
left: 1px; 
margin: 0px; }
.tabbclaim  [type=radio] { display: none;  baseline-tab-shift: true, retrieve; }

.tabbclaim [type=radio]:checked ~ label { z-index: 99; background-color:#a5172f;  }
.tabbclaim [type=radio]:checked ~ label ~ .claims22 { z-index: 98; }

.claim2 {
	position: absolute;
	top: 50px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	background: white;
	width: 400px;
	height: 300px;
	OVERFLOW: AUTO;
	font-family:  Calibri, serif; 
	font-size: 9px; 
	letter-spacing: 1px;
	text-align:justify;
	padding: 20px;
}





/* application */
.app1 {
    background-image: url(http://i.imgur.com/Bj39Q.png);
    padding: 10px;
    width: 460px;
}
.app2 {
    background-color: white;
    padding: 10px;
}
.app3 {
    width: 435px;
}
.app4 {
    background-color: #ddddee;
    font-family: courier new;
    font-size: 9px;
    line-height: 8px;
    color: #777;
    font-weight: none;
    padding: 2px;
    text-transform: uppercase;
}
.app5 {
    font-family: courier new;
    background-color: white;
    font-size: 9px;
    line-height: 8px;
    color: #777;
    font-weight: none;
    padding: 2px;
    text-transform: uppercase;
}
.app6 {
    border: 5px solid #ddddee;
    padding: 5px;
    height: 333px;
    text-align: justify;
    overflow: auto;
    color: #777;
}
.app7 {
    font-family: tahoma;
    background-color: white;
    text-align: justify;
    color: #777;
    font-weight: none;
    padding: 2px;
    height: 160px;
    overflow: auto;
    padding: 5px;
}
.app8 {
    font-family: tahoma;
    background-color: white;
    text-align: justify;
    color: #777;
    font-weight: none;
    padding: 2px;
    height: 200px;
    overflow: auto;
    padding: 5px;
    border: 5px solid #ddddee;
}
.app9 {
    font-family: 'Grand Hotel', cursive;
    font-size: 30px;
    line-height: 30px;
    color: #d6d1d8;
    text-shadow: 1px 0px 0px #b7b7b7;
    text-align: center;
    text-transform: lowercase;
    padding: 0px;
    background-color: white;
}
.app10 {
    font-family: courier new;
    background-color: white;
    font-size: 9px;
    line-height: 8px;
    color: #777777;
    font-weight: none;
    padding: 2px;
    text-transform: uppercase;
    text-align: center;
}
.app11 {
    font-family: tahoma;
    background-color: white;
    text-align: justify;
    color: #777;
    font-weight: none;
    padding: 2px;
    height: 100px;
    overflow: auto;
    padding: 5px;
    border: 5px solid #ddddee;
}
.general1 {
    width: 400px;
}
.general2 {
    font-family: 'Grand Hotel', cursive;
    font-size: 25px;
    line-height: 20px;
    color: #08318d;
    text-shadow: 1px 0px 0px #b7b7b7;
    text-align: center;
    text-transform: lowercase;
    padding-top: 5px;
    padding-left: 5px;
    padding-right: 5px;
}
.general3 {
    background-image: url(http://i.imgur.com/Bj39Q.png);
    padding: 10px;
}
.general4 {
    background-color: #fff;
    padding: 10px;
    text-align: justify;
}
.general5 {
    background-color: #ddddee;
    font-family: courier new;
    font-size: 9px;
    line-height: 8px;
    color: #777777;
    font-weight: none;
    padding: 2px;
    text-align: right;
    text-transform: uppercase;
}
.whosbox {
    width: 250px;
    margin: 0px auto;
    padding: 5px;
    border: 5px solid #ddddff;
}
#list2 {
    font-style: normal;
}
#list2 ol {
    font-family: 'Grand Hotel', cursive;
    font-size: 30px;
    line-height: 30px;
    color: #d6d1d8;
    text-shadow: 1px 0px 0px #b7b7b7;
}
#list2 ol li p {
    padding-left: 5px;
    font-style: normal;
    text-shadow: none;
    color: #000000;
    border-left: 1px solid #999;
    margin: 0px;
    display: block;
    font-family: tahoma;
    font-size: 11px;
    line-height: 10px;
}
#list2 ol li p em {
}
.headthing {
    background-color: #ddddee;
    font-family: courier new;
    font-size: 9px;
    line-height: 8px;
    color: #777777;
    font-weight: none;
    padding: 2px;
    text-transform: uppercase;
    text-align: center;
}
#staff1 {
    width: 146px;
    height: 130px;
    position: relative;
    overflow: hidden;
}
.staff2 {
    width: 146px;
    height: 130px;
    position: absolute;
    left: 0px;
    bottom: 0px;
    -moz-transition: all 1s ease-in-out;
    -webkit-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
}
#staff1:hover .staff2 {
    left: -250px;
    -webkit-transition: 1s all ease-in-out;
    -ms-transition: 1s all ease-in-out;
    -moz-transition: 1s all ease-in-out;
    transition: 1s all ease-in-out;
}
.staffthing {
    background-color: #ddddee;
    font-family: courier new;
    font-size: 9px;
    line-height: 8px;
    color: #777777;
    font-weight: none;
    padding: 2px;
    text-transform: uppercase;
    text-align: center;
    margin-bottom: 3px;
}
.miniq {
    background-image: url(http://i.imgur.com/Bj39Q.png);
    padding: 10px;
}
#miniz {
    height: 300px;
    width: 200px;
    position: relative;
    overflow: hidden;
}
.minix {
    height: 300px;
    width: 200px;
    position: absolute;
    left: 0px;
    bottom: 0px;
    -moz-transition: all 1s ease-in-out;
    -webkit-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
}
#miniz:hover .minix {
    left: -250px;
    -webkit-transition: 1s all ease-in-out;
    -ms-transition: 1s all ease-in-out;
    -moz-transition: 1s all ease-in-out;
    transition: 1s all ease-in-out;
}
.desc1 {
    margin: 10px auto;
margin-left: -5px;
    width:320px;
border-radius: 10px 30px 10px 30px; -moz-border-radius: 10px 30px 10px 30px; -webkit-border-radius: 10px 30px 10px 30px; -ms-border-radius: 50px 40px 5px 40px; -o-border-radius: 10px 40px 10px 40px;
    background-color: #f3e8ca;
box-shadow: 0 2px 6px #dca565;
    padding: 10px;

}
.desc2 {
    background-color: #;
    padding: 5px;
margin-left: 5px;
    text-align: justify;
}
#fordescx {
    height: 150px;
    width: 310px;
    position: relative;
    overflow: hidden;
}
.fordesc {
    height: 150px;
    width: 310px;
    position: absolute;
    left: 0px;
    bottom: 0px;
    -moz-transition: all 1s ease-in-out;
    -webkit-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
}
#fordescx:hover .fordesc {
    left: -250px;
    -webkit-transition: 1s all ease-in-out;
    -ms-transition: 1s all ease-in-out;
    -moz-transition: 1s all ease-in-out;
    transition: 1s all ease-in-out;
}
.bigbutton {
    font-family: 'Grand Hotel', cursive;
    font-size: 30px;
    line-height: 30px;
    color: #d6d1d8;
    text-shadow: 1px 0px 0px #b7b7b7;
    margin-right: 15px;
}
.smallbutton {
    background-color: #ddddee;
    font-family: courier new;
    font-size: 9px;
    line-height: 8px;
    color: #777777;
    font-weight: none;
    padding: 2px;
    text-transform: uppercase;
    text-align: center;
    margin-right: 5px;
}
.announce {
    font-family: 'Grand Hotel', cursive;
    font-size: 30px;
    line-height: 30px;
    color: #d6d1d8;
    text-shadow: 1px 0px 0px #b7b7b7;
    margin-right: 15px;
    text-align: center;
}
.announcebody {
    font-family: courier new;
    font-size: 9px;
    line-height: 8px;
    color: #777777;
    font-weight: none;
    padding: 2px;
    text-transform: uppercase;
    text-align: justify;
    margin: 0px auto;
    width: 300px;
}



#pun-index .tcl h3 {
font-size: 1.2em;
font-weight: bold;
text-align: center;
text-transform: uppercase;
    padding: 10px;
}


  <div align='right'>
         <a href='javascript:scroll(0,0);'>^</a>
        </div>
      </td>
    </tr>
    </table>
    <div class='darkrow1' style='height:5px'><!-- --></div>
    </span>








element.style {
}
#ex4 img {
margin: 10px;
border: 4px solid #eee;
-webkit-box-shadow: 4px 4px 4px rgba(0,0,0,0.2);
-moz-box-shadow: 4px 4px 4px rgba(0,0,0,0.2);
box-shadow: 2px 2px 2px rgba(0,0,0,0.2);
-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
}

#ex4 {
	width: 620px;
	margin: 0 auto;
}
 
#ex4 img {
	margin: 10px;
	border: 4px solid #eee;
	-webkit-box-shadow: 4px 4px 4px rgba(0,0,0,0.2);
	-moz-box-shadow: 4px 4px 4px rgba(0,0,0,0.2);
	box-shadow: 2px 2px 2px rgba(0,0,0,0.2);
	-webkit-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}
 
#ex4 img:hover {
	-webkit-transform: rotate(-7deg);
	-moz-transform: rotate(-7deg);
	-o-transform: rotate(-7deg);
}




/* CS2.2 */
.punbb a:hover, .punbb a:focus, .punbb a:active,  .punbb-admin #pun-admain .nodefault,
.punbb-admin #punbb-admain a:hover, .punbb-admin #punbb-admain a:focus, .punbb-admin #punbb-admain a:active {
  color: #0c7201; 
  text-decoration: none; font-weight: bold }



/* CS2.4 */
#pun-navlinks a:hover, #pun-navlinks a:focus, #pun-navlinks a:active {
  color: #0c7201;
  text-decoration: none; font-weight: bold}



A.navi:link, A.navi:active, A.navi:visited {
display:inline-block;
color:#2c2119;
line-height: 7px;
padding:4px;
text-align: center;
background:#eed99f;
transition-duration: 0.6s;
-moz-transition-duration: 0.6s;
-webkit-transition-duration: 0.6s;
-o-transition-duration: 0.6s;

width:100px;
margin:1px;
}

A.navi:hover {
color:#413123;
background:#ee9d3c;
}


<!-- amst.quest -->
<style type="text/css">
.hoveerr { height: 210px; width: 350px; border: 8px solid #ffffff; margin-left: 3px; box-shadow: 1px 1px 3px #c2c2c2; overflow-y scroll overflow-x hidden; }
.wordd { margin-top: -60px; background-color: #daae52; padding: 3px; color: #2f2f2f; font-family: oswald; font-size: 14px; text-align: center; -webkit-transition: all 0.9s ease; -moz-transition: all 0.9s ease; -o-transition: all 0.9s ease; }
.notee { margin-top: 250px; background-color: #2f2f2f; padding: 3px; color: #daae52; font-family: oswald; font-size: 14px; text-align: center; -webkit-transition: all 0.9s ease; -moz-transition: all 0.9s ease; -o-transition: all 0.9s ease; }
.note1 { margin-top: 200px; background-color: #2f2f2f; padding: 2px; color: #daae52; font-family: oswald; font-size: 10px; text-align: center; -webkit-transition: all 0.9s ease; -moz-transition: all 0.9s ease; -o-transition: all 0.9s ease; }
.hoveerr:hover  .wordd { margin-top: 60px; -webkit-transition: all 0.9s ease; -moz-transition: all 0.9s ease; -o-transition: all 0.9s ease; }
.hoveerr:hover  .notee { margin-top: 10px; -webkit-transition: all 0.9s ease; -moz-transition: all 0.9s ease; -o-transition: all 0.9s ease; }
.hoveerr:hover  .note1 { margin-top: 10px; -webkit-transition: all 0.9s ease; -moz-transition: all 0.9s ease; -o-transition: all 0.9s ease; }
.toproww { border-left: 20px solid #daae52; background-color: #2f2f2f; height: 15px; color: #daae52; font-family: oswald; font-size: 14px; font-weight: bold; text-align: center;}
.toproww1 { border-right: 20px solid #daae52; background-color: #2f2f2f; height: 15px; color: #daae52; font-family: oswald; font-size: 14px; font-weight: bold; text-align: center;}
.dalbody { width: 370px; font-size: 14px; font-family: Bad Script; text-align: justify; line-height: 13px; padding: 20px; padding-bottom: 20px; background-color: #ffffff; box-shadow: 1px 1px 3px #c2c2c2;}
.outrun { text-align: right; margin-left: 15px; font-family: OSWALD; font-size: 31px; font-weight: bold; color: #252525; line-height: 32px; letter-spacing: -2px; position: relative;}
.outrun2 {margin-top: 05px; margin-left: 15px; text-align: right; font-family: OSWALD; font-size: 33px; font-weight: bold; color: #252525; line-height: 30px; letter-spacing: -2px; position: relative; opacity: 0.5; -webkit-transform: scaleY(-1); -moz-transform: scaleY(-1); -o-transform: scaleY(-1); }
.toxxic b { color: #3D59AB !important; }</style>


<!-- amst.welcome -->
<style> #amst { width: 500px; height: 250px; margin: 20px; margin-bottom: 5px; overflow: hidden; } #amst .amstname { width: 360px; line-height: 20px; font-size: 35px; text-align: right; text-transform: lowercase; color: #fff; text-shadow:1px 1px #ddd, 4px 4px #7e6b84; font-family: 'Lobster', cursive; letter-spacing: -1px; } #amst .amsttext { width: 440px; padding: 5px; background-color: #fff; font-family: calibri; color: #333; text-align: justify; font-size: 9px; letter-spacing: 1px; line-height: 10px; box-shadow: 1px 1px #ddd; text-transform:uppercase; height: 140px; } #amst .amstlinks { width: 320px; height: 20px; line-height: 20px; text-align: center; font-family: calibri; text-transform: uppercase; letter-spacing: 1px; padding-top: 5px; } #amst .amstlinks a { width: 60px; height: 20px; margin-right: 5px; text-align: center; background-color: #7e6b84; display: block; float: left; color: #fff; font-size: 8px; position: relative; z-index: 10; } #amst .amstlinks a:last-child { margin-right: 0px; } #amst .amstgif { width: 120px; height: 101px; margin-right: 10px; float: left;background-position: center; } #amst .amstsig { width:500px; opacity: 0; height:200px; transition-duration: 1.2s; -moz-transition-duration: 1.2s; -webkit-transition-duration: 1.2s; -o-transition-duration: 1.2s; -webkit-transform: perspective(100) rotateY(90deg); -webkit-transform-origin: 0% 0%; -moz-transform: perspective(100) rotateY(90deg); -moz-transform-origin: 0% 0%; -o-transform: perspective(100) rotateY(90deg); -o-transform-origin: 0% 0%; transform: perspective(100) rotateY(90deg); transform-origin: 0% 0%; -ms-transform: perspective(100) rotateY(90deg); -ms-transform-origin: 0% 0%; } #amst:hover .amstsig { -webkit-transform: perspective(100) rotateY(0deg); -webkit-transform-origin: 0% 0%; -moz-transform: perspective(100) rotateY(0deg); -moz-transform-origin: 0% 0%; -o-transform: perspective(100) rotateY(0deg); -o-transform-origin: 0% 0%; transform: perspective(100) rotateY(0deg); transform-origin: 0% 0%; -ms-transform: perspective(100) rotateY(0deg); -ms-transform-origin: 0% 0%; opacity: 1; } .amstbuttons { width: 500px; height: 55px; margin-bottom: 20px} .amstbuttons img { height: 55px; width: auto; } </style>




.miniprofile { 
width: 180px;
text-align: center;
}

.hoverprofile { width: 181px; height: 183px; background-color: #f3e9ce; opacity: 0; position: absolute; z-index: 2; margin-top: 4px; transition: 0.6s; -moz-transition: 0.6s; -webkit-transition: 0.6s; -o-transition: 0.6s; }

.hoverprofile:hover { opacity: 0.9; transition: 0.6s; -moz-transition: 0.6s; -webkit-transition: 0.6s; -o-transition: 0.6s;}

.pa-fld1 {color: #3e1e01 !important; font-size:10px;
}


/* CS1.10 Профиль*/
.pa-posts {
margin-left: 0px;
border-radius: 5px;
border: double 3px #f2e1b4;
display: inline-block;
background-color: #f3e9ce;
text-align: center;
text-transform: lowercase;
padding: 0px 0px;
width: 70px;
color: #988b67;
}

.pa-respect {
border: double 3px #f2e1b4;
display: inline-block;
margin-left: 0px;
border-radius: 5px;
border: double 3px #f2e1b4;
display: inline-block;
background-color: #f3e9ce;
text-align: center;
text-transform: lowercase;
padding: 0px 0px;
width: 70px;
color: #988b67;
}