body {background: url('../images/exr/body-bkg.png') repeat-x top left transparent;}
body {font-family: 'Open Sans', sans-serif; font-size: .75em}

#root {width: 940px; background-color: #fff; margin: 0 auto; padding: 20px 10px;}
h1,h2,h3,h4 {text-transform: uppercase;}
input, select {font-family: 'Open Sans', sans-serif; font-size: 1em;  }
select {height: 30px}
input[type=text],input[type=password], select {border: 1px solid #d0d1d2; padding: 5px; width: 120px; margin: 5px 0}
a {color: #a33991; text-decoration: none;}
input.violet, button.violet, a.button.violet {background: url('../images/exr/button.png') no-repeat top left white; color: #fff; border: 0; padding:4px 0 5px; height: 30px; width: 80px}
input.violet:hover, button.violet:hover,a.button.violet:hover { border: 1px solid transparent; border-radius: 4px; background: #a33991}

input.violet2, button.violet2 {background: url('../images/exr/button2.png') no-repeat top left white; color: #fff; border: 0; padding: 5px; height: 49px; width: 89px; font-size: 1.5em; line-height: .666em}
input.violet2:hover, button.violet2:hover { border: 1px solid transparent; border-radius: 4px; background: #a33991}
input.violet2, button.violet2 i, input.disabled, button.disabled i  {font-style: normal; font-size: .666em; display: block; width: 80px}

input.violet3, button.violet3, a.button.violet3 {background: url('../images/exr/button3.png') no-repeat top left white; color: #fff; border: 0; padding:4px 0 5px; height: 30px; width: 156px}
input.violet3:hover, button.violet3:hover,a.button.violet3:hover { border: 1px solid transparent; border-radius: 4px; background: #a33991}

input.disabled, button.disabled {background: url('../images/exr/button2.png') no-repeat top left white; color: #fff; border: 0; padding: 5px; height: 49px; width: 89px; font-size: 1.5em; line-height: .666em}
input.disabled.on:hover, button.disabled.on:hover {border: 1px solid transparent; border-radius: 4px; background: #a33991}

.clear {clear: both}
strong {font-weight: bold}
#slider {width: 940px; height: 350px}
.slider2 {margin-top: 10px}

.msg { background-color: #fcdf61; padding: 5px 0; margin: 5px 0; border-radius: 4px; min-height: 32px; line-height: 32px}
.msg img { float: left; margin-left: 12px; }
.msg span { float: left; line-height: 31px; font-size: 1.083em; color: #343a3f; margin: 0 10px; }
.msg a { float: left; line-height: 31px; font-size: 1.083em; color: #a33991; }
.msg .icon {float: left; width: 45px; height: 31px}
.msg.alert .icon {background: url('../images/exr/notify-icon.png') no-repeat top left transparent;}
.msg.ok .icon {background: url('../images/exr/notify-ok.png') no-repeat top left transparent;}
.msg.ok {background-color: #c3fc61;}
form label {width: 150px; float: left; line-height: 2.416em; margin: 5px 0}
.remind-link {padding: 0 0 0 404px; line-height: 16px; font-size: 10px; text-decoration: underline}
#header .info.big {float: right;  height: 30px; text-align: right; margin-right: 10px; font-size: .916em; padding-top: 4px; color: #6c767c; text-transform: uppercase}
#header .info.big a {text-transform: uppercase; }

.general h1 {margin: 10px; font-size: 1.5em}
.general .default-form { width: 600px }
.general .green-box {width: 650px; margin: 10px auto; padding: 20px; background-color: #dcfeca; border-radius: 4px;}
.general .green-box p {margin: 10px}

.general.static {padding: 10px}
.general.static h1 {margin: 10px 0}
.general.static p {line-height: 1.5em; padding-bottom: 10px}

/* header */ 
h1.logo {width: 300px; height: 100px; background: url('../images/exr/logo.png') no-repeat top left white; float: left; }
h1.logo a {text-indent: -20000px; display: block; width: 300px; height: 100px;}

#header form.login {float: right}
#header form.login .info {float: left; width: 200px; text-align: right; margin-right: 10px; font-size: .916em; line-height: 2em; padding-top: 4px; color: #6c767c}
#header form.login .info, #header form.login .info a {text-transform: uppercase; }
#header form.login input[type=text], #header form.login input[type=password]  {margin: 0 10px 0 0}

#root .menu {float: right; margin-top: 20px; width: 580px} 
#root .menu li {float: left;}

#root .menu li:hover {}
#root .menu li a {color: #343a3f; float: left; padding: 10px; font-size: 1.083em}
#root .menu li a:hover {color: #fff; background-color: #a33991; border-radius: 4px;}
#root .menu li a.home {width: 16px; height: 16px; display: block; text-indent: -20000px; background: url('../images/exr/home.png') no-repeat 10px 10px white; }

/* main page */ 
.slider {height: 350px}
.boxes {float: left; margin: 30px 0 0 15px} 
.boxes li {width: 300px; border-right: 1px solid #d0d1d2; height: 150px; float: left}
.boxes li.demo {background: url('../images/exr/laptop.png') no-repeat 0px 15px white;}
.boxes li.demo a {text-transform: uppercase; font-size: 1.5em; width: 100px; margin: 25px 0 0 205px; float: left; line-height: 1.2em}
.boxes li.buy {background: url('../images/exr/ex-box.png') no-repeat 20px 0px white;}
.boxes li.buy .info {margin: 25px 15px 0 145px; float: left; text-align: justify; color: #6c767c}
.boxes li.buy a {text-transform: uppercase; font-size: 1.5em; margin: 10px 0 0 145px; float: left;}
.boxes li.contact {background: url('../images/exr/contact.jpg') no-repeat right top white; border: 0; margin: 0}
.boxes li.contact h3 {font-size: 1.5em; margin: 20px 0 5px 20px}
.boxes li.contact h3 strong {font-weight: bold}
.boxes li.contact h4 {font-size: 1em; margin: 0px 0 15px 20px; color: #6c767c}
.boxes li.contact a {text-transform: uppercase; font-size: 1.5em; padding: 10px 0 0 20px}
.boxes li.contact a.email {text-transform: none; font-size: 1.166em;}

.steps {background: url('../images/exr/steps.png') no-repeat top left #fff; width: 540px; height: 150px; float: left; margin-right: 20px; margin-left: 20px}
.steps  a {float: right; margin: 130px 128px 0 0}
.steps  a.first {margin-right: 15px}
.steps  a.one {margin: 0; text-indent: -20000px; display: block; width: 100%; height: 100%}

.refs {background-color: #f2f2f2; padding: 20px; color: #6c767c; height: 110px; width: 340px; float: right; line-height: 1.4em; font-size: .916em}
.refs h1 {color: #343a3f; font-size: 1.5em; margin-bottom: 10px}
.refs .right {text-align: right; color: #343a3f}

.promobox {background:  url('../images/exr/promo-bkg.png') repeat-x top left #fff; padding: 20px; color: #6c767c; height: 110px; width: 340px; float: right; line-height: 1.4em; font-size: 1em}
.promobox h1 {color: #343a3f; font-size: 1.5em; margin-bottom: 20px; text-align: center}
.promobox .right {text-align: right; color: #343a3f}

.promobox2 {background: url('../images/exr/rabat.jpg') no-repeat top left #fff; width: 310px; height: 150px; float: left; margin-left: 40px}
.promobox2  a {margin: 0; text-indent: -20000px; display: block; width: 100%; height: 100%}

.logos {display: table; width: 100%; margin: 30px 0}
.logos a {display: table-cell; text-align: center}
.logos a img {opacity: .3;  filter: alpha(opacity=30);}
.logos a img:hover {opacity: 1; filter: alpha(opacity=100);}
.promo-form input[type=text] {display: block; width: 290px; margin: 10px auto; text-transform: uppercase; font-size: 1.2em; text-align: center}
.promo-form input[type=submit] {float: right; margin-right: 20px }

/* cennik */
.products.downloads .info h1 {margin-top:10px; margin-bottom: 5px;}
.products.downloads .info p.size {margin-top: 8px}
.product .info {float: left; width: 80%; }
.product form {float: right}
.product {background:  url(../images/exr/item-box.png) no-repeat top left #fff; margin: 10px 0; position: relative; border: 1px solid #E5E5E5;}
.product .info .img {margin: 10px 10px 0; border: 1px solid #eee; width: 160px; height: 110px; float: left; background-color: #fff; text-align: center; padding: 5px 0; line-height: 110px;}
.product .info .img span {  }
.product .info h1, .product .info table, .product .info p {float: left}
.product .info h1 {margin: 15px 10px 5px 10px; font-size: 1.25em; width: 510px; }
.product .info table {margin: 0 10px; font-size: 12px; line-height: 16px }
.product .info th {text-align: right; color: #6c767c; padding-right: 10px}
.product .info p {width: 510px; margin: 5px 10px 10px 10px;}
.product form, .downloads .box {width: 150px; height: 85px; background-color: #f8f9fa; margin: 10px; padding-top: 35px; height: 85px }
.downloads .box {float: right}
.product form button {margin: 0 auto; display: block}
.product .desc {min-height: 100px; background:  url('../images/exr/item-box2.png') no-repeat top left #e6e7eb; margin: 0; padding: 20px; color: #6c767c; font-size: 1.083em; line-height: 2em}
.product .info .about {line-height: 2em; color: #6c767c; margin: 0 10px; text-align: justify; position: static}


a.button.violet {display: block; background: url('../images/exr/button.png') no-repeat top left white; text-align: center; border: 1px solid transparent;
                 color: #fff; padding: 8px 0; height: 14px; width: 80px; margin: 0 auto;}
a.button.violet:hover {border-radius: 4px; background: #a33991; border: 1px solid transparent;}

.products {margin: 0 10px}
.content .tab { padding: 0 10px; border: 1px solid #e5e5e5; float: left}
.content .tabs {display: block; margin: 10px 0 0 0;  width: 100%; float: left }
.content .tabs li {float: left}

.content .tabs li a {margin: 0 5px 0 0; color: #000; float: left; padding: 10px; font-size: 1.083em; background-color: #e5e5e5;   border-top-left-radius: 4px;  border-top-right-radius: 4px; }
.content .tabs li a:hover, .content .tabs li a.active  {color: #fff; background-color: #a33991;}

/* faq */
.faq-main { width: 940px; margin-top: 20px; }
.faq-main .faq-list { }
.faq-main .faq-list li { width: 938px; background: url('../images/exr/faq_bg.png') repeat-x; border: 1px solid #e7e7e7; margin-top: 10px; float: left; }
.faq-main .faq-list li h2 { line-height: 48px; font-size: 1.166em; color: #343a3f; float: left; margin-left: 20px; }
.faq-main .faq-list li a { float: right; margin-right: 20px; line-height: 48px; cursor: pointer; }
.faq-main .faq-list li .resp { float: left; color: #6c767c; font-size: 1.083em; padding: 20px; line-height: 20px; background: #e6e7eb url('../images/exr/resp-bg.png') repeat-x; width: 898px; border: 0; text-align: justify; }

/* funkcjonalnosc */
.funkcjonalnosc { width: 940px; margin-top: 20px; }
.funkcjonalnosc .categories { float: left; width: 290px; background: #ecedef url(../images/exr/categories-bg.png) repeat-x; background-position: top center; padding: 10px; }
.funkcjonalnosc .categories .category { margin-bottom: 30px; }
.funkcjonalnosc .categories .category li { width: 290px; float: left }
.funkcjonalnosc .categories .category li h2 { line-height: 45px; font-size: 14px; color: #343a3f; margin-left: 10px; cursor: pointer; width: 280px; height: 45px; margin: 0; padding-left: 10px; font-weight: bold}
/*.funkcjonalnosc .categories .category li .subcat { display: none; }*/
.funkcjonalnosc .categories .category li .spacer { background: url(../images/exr/spacer.png) repeat-x; width: 290px; height: 2px; float: left; margin: 10px 0;}
.funkcjonalnosc .categories .category .current {  }
.funkcjonalnosc .categories .category .current h2 { background: url('../images/exr/func-cat-bg.png') repeat-x; color: #ffffff; }
.funkcjonalnosc .categories .category .subcat { float: left; margin-top: 10px;  }
.funkcjonalnosc .categories .category .subcat li { width: 260px; border: none; padding-left: 30px; }
.funkcjonalnosc .categories .category .subcat li a { font-size: 12px; line-height: 30px; color: #343a3f; }
.funkcjonalnosc .categories .category .subcat li:hover, .funkcjonalnosc .categories .category .subcat li.active { background-color: #ecedf0; color: #a33991; }
.funkcjonalnosc .categories .category .subcat li a:hover, .funkcjonalnosc .categories .category .subcat li a.active { color: #a33991; }
.funkcjonalnosc .desc { margin-left: 10px; float: left; width: 620px; text-align: center }
.funkcjonalnosc .desc .text { background: url(../images/exr/func-desc-bg.png) repeat-x; width: 600px; min-height: 160px; font-size: 12px; color: #343a3f; padding: 20px 10px; line-height: 20px; text-align: justify; }

/* order */
.order {margin: 20px 0}
.order .left {float: left; width: 610px; border-right: 1px solid #d3d4d5; padding-right: 10px}
.order .right {float: right; width: 290px; color: #6c767c; padding: 10px}
.order.signup .left {border-right: 0}
.order.signup .right {border-left: 1px solid #d3d4d5;}
.order label, .order legend {width: 190px; text-align: right; padding: 0 10px 0 0}
.order label.radio {line-height: 1em}
.order input[type=text], .order input[type=password] {width: 250px; border: 1px solid #d3d4d5; height: 18px}
.order input[type=radio] {margin: 0; margin: 6px 0 0 0} 
.order .right h2 {margin: 20px 0 10px 0; color: #343a3f; font-size: 1.166em}
.order input[type=submit] {margin-top: 15px}
.order .right p {line-height: 2em}

.order select {width: 262px}
.order label[for=r-product] {text-transform: uppercase; font-size: 1em; font-weight: bold; text-align: center}
.order legend {padding: 20px 0; font-weight: bold; display: block; text-align: -webkit-right}
.order fieldset.first { margin: 10px 0}
.order fieldset.first p { margin: 10px 0 0 30px; line-height: 1.5em }
.order form .msg {width: 260px; margin-left: 200px }
.order form .msg.big {line-height: 16px}
#d-address2 { display: none; }
.order form .error, .panel form .error, .order form .info {display: block; margin-left: 200px; color: red}
.order form .info {display: block; margin-left: 200px; color: green; width: 260px; line-height: 1.5em}
.order form label .error { margin-left: 0; }
.order form .radiotext { margin-top: 5px; float: left; width: 400px; line-height: 1.5em }
.panel form .error {margin-left: 190px;}

.ordersum {float: left; width: 100%}
.ordersum .left, .ordersum .right {width: 33.33%; margin: 0; float: left}
.ordersum h1 { text-transform: none; font-size: 1.333em; margin: 0; color: #343a3f }
.ordersum h2 {text-transform: none; font-size: 1.333em; line-height: 40px;  margin-left: 10px;   text-transform: none; color: #343a3f}
.ordersum table {margin: 0 auto; border-collapse: collapse }
.ordersum .sum td {font-weight: bold; font-size: 1.416em; color: #A33991}
.ordersum form {float: left; width: 100%; margin: 20px auto; text-align: center}
.ordersum .person { background-color: #fce5c3; padding: 20px; margin: 20px 0 5px 0}
.ordersum .person h2 { font-size: 1.166em; color: #343a3f; }
.ordersum .person table { margin: 20px 0 0 0; width: 290px; font-size: 12px; }
.ordersum th {color: #726351;  line-height: 16px;   text-align: right;   width: 130px;}
.ordersum td {color: #41474C;  line-height: 16px;   padding-left: 10px;   text-align: left;  width: 150px;}

.ordersum .left .dark th, .ordersum .left .dark td {background-color: #F2F2F2}
.ordersum .left th, .ordersum .left td  {line-height: 30px; background-color: #F6F6F6; border-bottom: 1px solid #fff}
.ordersum .left .sum th, .ordersum .left .sum td {background-color: #fce5c3; font-weight: bold; font-size: 1.333em}
.ordersum .left th {color: #726351;  text-align: right;   width: 130px;}
.ordersum .left td {color: #41474C;  padding-left: 10px;   text-align: left;  width: 150px;}
.ordersum button.violet {padding-bottom: 7px; font-size: 1em}

.thanks {margin: 30px auto; min-height: 200px; background-color: #dcfeca; border-radius: 4px; width: 580px; padding: 20px; color: #41474c}
.thanks a.pdf {line-height: 72px; font-size: 1.333em; display: block; margin: 10px}
.thanks p {margin: 10px}
.thanks a.pdf img {float: left}

/* kontakt */
.kontakt { margin-top: 20px; }
.kontakt h2 { color: #343a3f; font-size: 12px; font-weight: bold; }
.kontakt .left { float: left; width: 240px; }
.kontakt .left h2 { margin: 20px 0 20px 10px; }
.kontakt .left span { color: #343a3f; font-size: 12px; margin-left: 20px; display: block; line-height: 20px; }
.kontakt .left .adres { border-top: 1px solid #d0d1d2; margin-top: 40px; padding-top: 30px; width: 210px; padding-left: 10px; line-height: 1.5em }
.kontakt .left .adres span { margin: 0; }
.kontakt .right { float: left; width: 698px; }
.kontakt .form-box {float: left; width: 100%; min-height: 330px; background: url(../images/exr/kontakt-bg.png); border: 1px solid #e5e5e5; }
.kontakt .right h2 { margin: 20px 0 0 95px; }
.kontakt .right form { width: 413px; margin: 10px auto; }
.kontakt .right form fieldset { width: 420px; }
.kontakt .right form label { width: 100px; float: left; text-align: right; margin-right: 10px; color: #6c767c }
.kontakt .right form span {display: block; line-height: 1.5em; margin: 0 0 0 115px; color: red}
.kontakt .right form .text { width: 290px; height: 18px; border: 1px solid #d0d1d2; }
.kontakt .right form textarea { width: 290px; height: 140px; padding: 5px; margin: 5px 0}
.kontakt .right form .submit { background: url(../images/exr/button.png); width: 80px; height: 30px; }
.kontakt .right form [type=submit] {float: right; margin: 15px 0 10px 0}
.kontakt .right .result {text-align: center; font-size: 1.5em; margin: 10px 0}
.kontakt .right .success {color: green;}
.kontakt .right .error {color: red;}

/* materialy szkoleniowe */
.materials { width: 938px; }
.materials .material { float: left; background: url(../images/exr/material-bg.png) repeat-x;  min-height: 278px; padding: 10px; border: 1px solid #e5e5e5; margin-bottom: 20px; }
.materials .material.first {margin-top: 10px}
.materials .material .left { float: left; }
.materials .material .left h2 { font-size: 18px; color: #343a3f; margin: 20px 0; width: 388px; }
.materials .material .left .desc { font-size: 11px; color: #6c767c; line-height: 20px; width: 368px; text-align: justify; }
.materials .material img { float: left; }

/* panel */
.panel { width: 940px; padding-top: 20px; border-top: 1px solid #e5e5e5; }
#root .panel .menu { width: 300px; float: left; background-color: #f6f6f6; margin-top: 0; }
#root .panel .menu li {}
#root .panel .menu li h2 { background: url(../images/exr/li-bg.png) repeat-x; width: 280px; height: 39px; font-size: 14px; color: #343a3f; line-height: 39px; padding-left: 20px; }
#root .panel .menu li ul { margin: 20px 0; float: left; }
#root .panel .menu li ul li { width: 260px; margin-left: 10px; background: url(../images/exr/panel-spacer.png) repeat-x; background-position: bottom; }
#root .panel .menu li ul li
#root .panel .menu li ul li .spacer { background: url(../images/exr/panel-spacer.png) repeat-x; width: 260px; height: 2px; }
#root .panel .menu li ul li a { display: block; font-size: 12px; color: #a33991; line-height: 20px; padding: 5px 0 5px 10px; float: none}
#root .panel .menu li ul li a:hover { color: #fff; border-radius: 0; background-color: #a33991 }
.panel .right { width: 620px; margin-left: 20px; float: left; }
.panel .right .komunikat { width: 620px; background-color: #fcdf61; padding: 5px 0; }
.panel .right .komunikat img { float: left; margin-left: 12px; }
.panel .right .komunikat span { float: left; line-height: 31px; font-size: 12px; color: #343a3f; margin: 0 10px; }
.panel .right .komunikat a { float: left; line-height: 31px; font-size: 10px; color: #a33991; }
.panel .right h1 { color: #343a3f; font-size: 16px; margin: 20px; }
.panel .right p { width: 580px; color: #6c767c; font-size: 11px; line-height: 16px; margin-left: 20px; display: block; text-align: justify; margin-bottom: 20px; }
.panel .right .info { width: 340px; background-color: #fce5c3; float: left; padding: 20px; }
.panel .right .info h2{ font-size: 14px; color: #343a3f; }
.panel .right .info dl { margin-top: 20px; width: 290px; float: left; font-size: 12px; }
.panel .right .info dl dt { float: left; width: 130px; text-align: right; color: #726351; line-height: 16px; }
.panel .right .info dl dd { float: left; width: 150px; text-align: left; margin-left: 10px; color: #41474c; line-height: 16px; }
.panel .right .download { float: left; margin-left: 20px; width: 220px; height: 142px; text-align: center; background: url(../images/exr/download-bg.png) repeat-x; }
.panel .right .download img { margin-bottom: 7px; }
.panel .right .download a {  }
.panel td input, .panel dd input {padding: 0; min-width: 240px; text-align: center; }

/* informacja */
.panel .right .informacja { width: 100%}
.panel .right .informacja tr { background-color: #f6f6f6; }
.panel .right .informacja th { width: 130px; margin-bottom: 1px; line-height: 30px; text-align: right; font-size: 12px; color: #6c767c; }
.panel .right .informacja td { margin-bottom: 1px; line-height: 30px; padding-left: 10px; font-size: 12px; color: #41474c; }
.panel .right .informacja .dark { background-color: #f2f2f2; }

/* lista faktur */
.panel .right .invoices { width: 620px; font-size: 12px; }
.panel .right .invoices th { line-height: 40px; background-color: #f0f0f0; color: #41474c; text-align: center; border-right: 1px solid #dfdfdf; border-left: 1px solid #ffffff; }
.panel .right .invoices tr {  }
.panel .right .invoices td { line-height: 30px; text-align: center; color: #6c767c; border-right: 1px solid #eaeaea; border-bottom: 1px solid #eaeaea; }
.panel .right .invoices .bottom td { border-bottom: 0; }
.panel .right .invoices .farright { border-right: 0; }
.panel .right .invoices td a { margin-left: 5px; }
/* zmien e-mail */
.panel .right  form { width: 460px; margin-bottom: 60px; }
.panel .right  form fieldset { width: 460px; color: #343a3f; }
.panel .right  form fieldset label { width: 180px; float: left; text-align: right; margin-right: 10px; }
.panel .right  form fieldset .inactive { width: 250px; float: left; border: 0; }
.panel .right  form fieldset [type=text], .panel .right  form fieldset [type=password] { width: 250px; float: left; border: 1px solid #d0d1d2; height: 20px; }
.panel .right  form fieldset [type=radio] { width: 20px; float: left; height: 35px; }
.panel .right  form .submit { background: url(../images/exr/button.png); width: 80px; height: 30px; border: 0; font-size: 12px; color: #ffffff; cursor: pointer; margin: 20px 0 0 190px; }
/* edycja */
.panel .right form h2 { color: #343a3f; font-weight: bold; margin: 10px 0; width: 180px; text-align: right; }

/* contact */
.contact {margin: 10px}
.contact .right {float: right; width: 45%}
.contact form span { display: block; margin-left: 150px; color: red; height: 15px }

/* footer */
#footer {margin-top: 20px}
#footer .note {border-top: 1px solid #d0d1d2; border-bottom: 1px solid #d0d1d2; padding: 10px 0; color: #6c767c; }
#footer .note .center { float: left; text-align: center; margin-top: 10px}
#footer .note .left, #footer .note .center , #footer .note .right {width: 33%}
#footer .note .kl {width: 280px}
#footer .note .eu {width: 170px}
#footer .note .eu {width: 170px; margin-top: 10px}
#footer h4 {margin-top: 10px;  text-align: center; margin-bottom: 10px;}
#footer .note .left {float: left}
#footer .note .right {float: right; font-size: .75em; text-align: right}
#footer .note .right p {width: 400px; float: left; text-align: justify; margin-left: 10px}
#footer .menu {float: left; font-size: .75em; margin: 0; width: auto}
#footer .menu li a:hover {background-color: transparent; text-decoration: underline; color: inherit}
#footer .credits {float: right; font-size: .75em; padding: 10px}

#c-info-cookie {margin: 5px auto;width:930px;display:none;background-color: #F8F8F8;
                            border: 1px solid #E4E4E4;
                            color: #58585A;
                            font-size: 12px;
                            padding: 16px;
                            font-family: Arial;
            }
#c-info-cookie p {margin-top:5px;margin-bottom:5px;line-height: 20px;font-size: 12px;text-align: center;}
#c-info-cookie a {color:#717171;text-decoration: none;font-weight: bold;}
#c-accept-cookie {cursor: pointer;float:right;margin-top:-10px;margin-right: 0px}
#c-more {width:500px;padding: 15px;}

#c-more p {font-size: 11px;line-height: 17px;text-align: justify;}
            #c-more ul {list-style: none;font-size: 11px;line-height: 17px;padding:0px 0px 0px 10px;text-align: justify;}
            #c-more a {color: #717171;text-decoration: none;}
			
			#c-more {background-color: #fff;
border-radius: 10px 10px 10px 10px;
box-shadow: 0 0 25px 5px #999999;
color: #111111;
display: none;
min-width: 450px;
padding: 25px;
position:abosolute; top: 50px !important; } 

.button.b-close, .button.bClose {
  border-radius: 7px 7px 7px 7px;
  box-shadow: none;
  font: bold 131% sans-serif;
  padding: 0 6px 2px;
  position: absolute;
  right: -7px;
  top: -7px;
  
  background-color: #2B91AF;
border-radius: 10px 10px 10px 10px;
box-shadow: 0 2px 3px rgba(0, 0, 0, 0.3);
color: #FFFFFF;
cursor: pointer;
display: inline-block;
padding: 5px 10px;
text-align: center;
text-decoration: none;
}

/* rightBox */
#rightBox {position: fixed; z-index: 10; top: 214px; right: -514px; height: 321px; width: 556px; transition: right 0.6s ease-in-out }
#rightBox.active {right: 0}
#rightBox .bar {width: 42px; background: url(../images/tpm/bar.png) top left no-repeat transparent; float: left; height: 321px; cursor: pointer; transition: background-image 0.6s ease-in-out}
#rightBox.active .bar {background: url(../images/tpm/bar_active.png) top left no-repeat transparent; }