﻿/* ===== Forum "Garni divchata tut": theme "Raspberry & Blush" ===== */
/* Palette: #a01856 raspberry, #c2307a pink, #8e1450 deep, #e0608f rose, #ffc94d amber, #fff0f6 blush bg, #5a1a3a plum text */

body {
  background-color: #fff0f6;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200' viewBox='0 0 200 200'%3E%3Crect width='200' height='200' fill='%23fff0f6'/%3E%3Cg fill='%23c2307a' fill-opacity='.08'%3E%3Cpath d='M40 50c-9-14-28-3-18 12l18 18 18-18c10-15-9-26-18-12z'/%3E%3Cpath d='M150 160c-7-11-22-2-14 9l14 14 14-14c8-11-7-20-14-9z'/%3E%3C/g%3E%3Cg fill='%23e0608f' fill-opacity='.12' transform='translate(140 50)'%3E%3Ccircle r='7'/%3E%3Cellipse cx='0' cy='-15' rx='7' ry='11'/%3E%3Cellipse cx='0' cy='15' rx='7' ry='11'/%3E%3Cellipse cx='-15' cy='0' rx='11' ry='7'/%3E%3Cellipse cx='15' cy='0' rx='11' ry='7'/%3E%3C/g%3E%3Cg fill='%23e0608f' fill-opacity='.10' transform='translate(55 150) scale(.7)'%3E%3Ccircle r='7'/%3E%3Cellipse cx='0' cy='-15' rx='7' ry='11'/%3E%3Cellipse cx='0' cy='15' rx='7' ry='11'/%3E%3Cellipse cx='-15' cy='0' rx='11' ry='7'/%3E%3Cellipse cx='15' cy='0' rx='11' ry='7'/%3E%3C/g%3E%3Cg fill='%23ffc94d' fill-opacity='.45'%3E%3Ccircle cx='100' cy='100' r='2.500'/%3E%3Ccircle cx='0' cy='0' r='2.500'/%3E%3Ccircle cx='200' cy='200' r='2.500'/%3E%3Ccircle cx='200' cy='0' r='2.500'/%3E%3Ccircle cx='0' cy='200' r='2.500'/%3E%3Ccircle cx='170' cy='110' r='2'/%3E%3Ccircle cx='30' cy='115' r='2'/%3E%3C/g%3E%3C/svg%3E");
  background-attachment: fixed;
  color: #3d1228;
  font-family: "Segoe UI", Verdana, Tahoma, Arial, "Trebuchet MS", Sans-Serif;
  font-size: 14px;
  line-height: 100%;
  margin: 0px;
  padding: 0px;
  text-align: center;
}

div.myname { width: 100%; height: 150px; background: linear-gradient(120deg,#8e1450,#c2307a 60%,#e0608f); border-bottom: 4px solid #ffc94d; }

a:link, a:visited, a:active { background: transparent; color: #a01856; text-decoration: none; }
a:hover { background: transparent; color: #e08a00; text-decoration: underline; }

.input-warn, .input-green, .input-checkbox, input, textarea, select {
  background: #ffffff;
  border: 1px solid #d782a8;
  border-radius: 12px;
  color: #3d1228;
  font-family: verdana, helvetica, sans-serif;
  font-size: 14px;
  margin: 5px;
  padding: 3px 8px;
  vertical-align: middle;
}
input:focus, textarea:focus, select:focus { border-color: #c2307a; outline: 0; box-shadow: 0 0 0 3px rgba(255,201,77,.55); background: #fffdf3; }

select { margin: 0px; }
.input-checkbox { border: none; }
.input-warn, .input-warn-content { border: 1px solid #c00; }
.input-ok, .input-ok-content { border: 1px solid #0a8a3a; }
.input-warn-content { padding: 4px; margin: 4px; background-color: #ffd6d6; }
.input-ok-content { padding: 4px; margin: 4px; background-color: #d8f5e0; }
.input-text { color: #a01856; }

input.button { margin: 0; width: auto; cursor: pointer; }

optgroup option { font-family: verdana, helvetica, sans-serif; font-size: 13px; }

.codebuttons { font-family: Verdana, Helvetica, Sans-Serif; font-size: 13px; vertical-align: middle; margin: 2px; }

.textarea, .searchinput, .button, .gobutton {
  background: #ffffff; border: 1px solid #d782a8; border-radius: 12px; color: #3d1228;
  font-family: Verdana, Helvetica, Sans-Serif; font-size: 13px; padding: 3px 8px; vertical-align: middle;
}
.button { background: linear-gradient(to bottom,#ffe3ef,#f7b6d1); color: #8e1450; cursor: pointer; }
.button:hover { background: #ffc94d; }
.gobutton { background: transparent; border: 0; color: #c2307a; margin: 0; vertical-align: middle; }

.radiobutton, .checkbox, .helpbox { border: 0; vertical-align: middle; background: transparent; }

table th, .borderwrap table th, .subtitle, .subtitlediv, .postlinksbar {
  background: linear-gradient(to bottom,#e0608f,#c2307a 60%,#a01856);
  border-bottom: 3px solid #ffc94d;
  color: #fff7e0; font-size: 13px; font-weight: bold; margin: 0; padding: 5px;
}

.newslink {
  background-color: #fff0f6;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'%3E%3Cg fill='%23c2307a' fill-opacity='.07'%3E%3Cpath d='M30 40c-9-14-28-3-18 12l18 18 18-18c10-15-9-26-18-12z'/%3E%3C/g%3E%3C/svg%3E");
  border: 1px solid #e9a3c2; border-left: 6px solid #c2307a; border-radius: 8px;
  margin: 0; width: 100%;
}
.newslink td { color: #5a1a3a; font-size: 14px; padding: 6px 6px 6px 12px; }
.newslink span { background: transparent; color: #a01856; font-style: italic; font-weight: normal; }
.newslink input { background: #ffffff; border: 1px solid #d782a8; color: #3d1228; font-size: 14px; padding: 3px 8px; vertical-align: middle; width: auto; }
.newslink input.button { background: transparent; border: 0; color: #a01856; vertical-align: middle; }

#logostrip { background: linear-gradient(120deg,#8e1450,#c2307a 60%,#e0608f); height: 150px; }

.maintitle_left, .maintitle_right {
  width: 8px; height: 31px; margin: 0; padding: 0; background-color: #c2307a; color: #fff;
  border-radius: 8px 0 0 0;
}
.maintitle_right { border-radius: 0 8px 0 0; }

.popmenubutton {
  width: 120px; white-space: nowrap; background-color: #ffe3ef; border: 1px solid #e9a3c2; color: #8e1450;
  font-weight: bold; float: right; text-align: center; margin: 0; font-size: 13px; padding: 3px; border-radius: 10px;
}

.vistasoftware img { position: absolute; top: 7px; left: 550px; clear: left }

.topbarad { font-size: 14px; font-weight: bold; color: #ffffff; padding: 3px; }
.topbarad a { color: #ffffff; }

.copyright { font-size: 12px; font-family: Verdana, Arial, Helvetica, sans-serif; color: #8a5a73; letter-spacing: 0; }
a.copyright, a.copyright:visited, .copyright a, .copyright a:visited { color: #a01856; text-decoration: none; }
a.copyright:hover, a.copyright:active, .copyright a:hover, .copyright a:active { color: #e08a00; text-decoration: underline; }

.quote, .q_table {
  font-family: Georgia,'Times New Roman',serif; font-size: 14px; color: #5a1a3a; line-height: 135%; font-style: italic;
  background-color: #fff5fa; border: 1px solid #e9a3c2; border-left: 5px solid #c2307a; padding: 5px 10px;
}
.code, .php_table {
  font-family: Courier, 'Courier New', monospace; font-size: 13px; color: #ffd9e8;
  background-color: #3d1228; border: 1px solid #a01856; border-left: 5px solid #ffc94d; padding: 5px 8px;
}

.subtitle { font-size: 16px; font-family: Georgia,'Times New Roman',serif; text-decoration: none; font-weight: bold; color: #fff7e0; }
.forumline { color: #3d1228; background-color: #ffffff; border: 2px solid #c2307a; border-radius: 8px; }

td.row1 { background-color: #fff8fb; }
td.row1_over { background-color: #ffeaf3; }
td.row2 { background-color: #fdeaf2; }
td.row2_over { background-color: #fbdbe8; }
td.row3, td.row3Right { background-color: #f9e0ec; }
td.row3_over { background-color: #f5cfe0; }
td.row4 { background-color: #f3c6da; }
td.spacer { background-color: #c2307a; }

td.rowpic { background-color: #ffffff; background-image: linear-gradient(to right,#ffc94d 0,#ffc94d 3px,#fff3f8 3px); background-repeat: repeat-y; }

th, td.th {
  color: #fff7e0; font-size: 13px; font-weight: bold; text-transform: uppercase; letter-spacing: .5px;
  background-color: #c2307a; height: 28px;
  background-image: linear-gradient(to bottom,#e0608f,#c2307a 60%,#a01856);
  border-bottom: 3px solid #ffc94d;
}

td.cat, td.catHead, td.catSides, td.catLeft, td.catRight, td.catBottom {
  background-color: #f7c7dc; background-image: linear-gradient(to bottom,#ffe3ef,#f4b3cf);
  color: #8e1450; font-weight: bold; height: 30px; border-bottom: 2px solid #c2307a;
}

td.th2 { background-color: #f4b3cf; height: 22px; color: #5a1a3a; }

td.spaceRow { background-color: #e0608f; background-image: linear-gradient(to right,#c2307a,#ffc94d,#c2307a); }

h1, h2 { font-weight: bold; font-size: 22px; font-family: Georgia,'Times New Roman',serif; text-decoration: none; line-height: 120%; color: #a01856; display: inline; }

.gen { font-size: 13px; }
.genmed { font-size: 12px; }
.gensmall, .gensmall2 { font-size: 12px; }
.genmedred { font-size: 12px; color: #d00; }
.gensmallred { font-size: 12px; color: #d00; }
.gensmallgreen { font-size: 12px; color: #0a8a3a; }
.gen, .genmed, .gensmall { color: #3d1228; }
a.gen, a.genmed, a.gensmall { color: #a01856; text-decoration: none; }
a.gen:hover, a.genmed:hover, a.gensmall:hover { color: #e08a00; text-decoration: underline; }
chekbox { color: #d00; background: #fbdbe8; }
form { display: inline; }

input.post, textarea.post, select { background-color: #ffffff; border-bottom: 2px solid #c2307a; }

input { text-indent: 2px; }

input.button { background-color: #ffe3ef; color: #8e1450; font-size: 13px; font-family: Verdana, Arial, Helvetica, sans-serif; }

input.mainoption { background-color: #c2307a; color: #fff7e0; font-weight: bold; cursor: pointer; }
input.mainoption:hover { background-color: #a01856; }

input.liteoption { background-color: #fff8fb; color: #8e1450; font-weight: normal; }

input.graybutton { background-color: #ece0e6; font-weight: normal; }
input.bluebutton { background-color: #e0608f; color: #ffffff; font-weight: normal; }

input.helpline { background-color: #fdeaf2; border: solid 1px #f4b3cf; }

.postformtitle { font-size: 14px; font-family: Georgia,'Times New Roman',serif; text-decoration: none; font-weight: bold; color: #a01856; }
.names { font-size: 14px; color: #a01856; font-weight: bolder; }
div.userstop { border-top: 2px solid #ffc94d; width: 100%; margin-top: 5px; padding-top: 5px; padding-bottom: 5px; }
img { border-top: 0px; border-bottom: 0px; border-right: 0px; border-left: 0px; }


/* WR-Forum Professional 2.2 styles */

/* 1) Page buttons */
.pgbutt a { font-family: Verdana; text-decoration: none; border: 1px #c2307a solid; background: #ffffff; color: #a01856; padding: 2px 6px; margin: 5px 2px 0 0;
 -moz-border-radius: 10px; -khtml-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; }
.pgbutt a:hover { background: #ffc94d; color: #5a1a3a; border-color: #a01856; }

input.button, input.liteoption, .fakebut { border: 1px solid #c2307a; background: #fff8fb; font-size: 13px; font-weight: bold; }

/* 2) QR-CODE */
#qr img { width:35px; height:35px; position: fixed; right: 10px; top: 10px; border: 2px solid #ffc94d; padding: 1px; background-color: white; border-radius: 6px; }
#qr img:hover { width:200px; height:200px; z-index:100; padding: 2px; }

/* 3) Guest avatar */
.guestavatar { width:120px; height:120px; text-align:center; background: linear-gradient(135deg,#c2307a 55%,#ffc94d 55%); color: #ffffff; font-size: 50px; text-shadow: 0 2px 4px rgba(0,0,0,.5);
display: table-cell; border-radius: 50%; position: relative; vertical-align: middle; }

/* 4) Admin navigation menu */
#nav8, #nav8 ul, #nav8 li { margin: 0; padding: 0; border: 0; }
#nav8, #nav8 ul { background: #5a1a3a; }
#nav8 { border-spacing: 0 0; position: relative; z-index: 50; width: 100%; }
#nav8 ul { position: absolute; display: none; border-top: 2px solid #ffc94d; }
#nav8 td:hover ul { display: block; }
#nav8 ul li { list-style: none; }
#nav8 .right { direction: rtl; }
#nav8 .right ul { right: 0; }
#nav8 .right li { direction: ltr; }
#nav8 a { display: block; padding: 8px 0; text-align: center; text-decoration: none; color: #fff0f6; }
#nav8 ul a { padding: 8px 15px; text-align: left; }
#nav8 td:hover, #nav8 li:hover { background: #c2307a; }
#nav8 td:hover > a, #nav8 li:hover > a { color: #ffc94d; }
#nav8 td { text-align: center; }

/* 5) Loading bar */
#cssbar-wrapper { width:300px; height:19px; position:absolute; left:50%; }
#cssbar-border { border:3px solid #c2307a; height:100%; width:100%; position:relative; left:-50%; top:-50%; padding:4px 3px; background:#ffffff; border-radius:6px; }
#cssbar-whitespace { overflow:hidden; height:100%; width:100%; margin:0 auto; position:relative; }
#cssbar-line { background-color:#ffc94d; position:absolute; height:100%; width:100%; animation:cssbar-slide 4s steps(40) infinite;
 -o-animation:cssbar-slide 4s steps(40) infinite; -ms-animation:cssbar-slide 4s steps(40) infinite;
 -webkit-animation:cssbar-slide 4s steps(40) infinite; -moz-animation:cssbar-slide 4s steps(40) infinite; }
@keyframes cssbar-slide {0% {left:-100%;} 100% {left:100%;}} @-o-keyframes cssbar-slide {0% {left:-100%;} 100% {left:100%;}}
@-ms-keyframes cssbar-slide {0% {left:-100%;} 100% {left:100%;}} @-webkit-keyframes cssbar-slide {0% {left:-100%;} 100% {left:100%;}}
@-moz-keyframes cssbar-slide {0% {left:-100%;} 100% {left:100%;}}