article,aside,details,figcaption,figure,footer,header,main,nav,section,summary {
display:block;
}

audio,canvas,video {
display:inline;
zoom:1;
}

audio:not([controls]) {
display:none;
height:0;
}

[hidden] {
display:none;
}

html {
font-family:Verdana,Tahoma,"DejaVu Sans",sans-serif;
font-size:100%;
-ms-text-size-adjust:100%;
-webkit-text-size-adjust:100%;
line-height:1.5em;
}

button,input,select,textarea {
font-family:inherit;
font-size:100%;
vertical-align:middle;
max-width:100%;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
margin:0;
}

a:focus {
outline:thin dotted;
}

a:active,a:hover {
outline:0;
}

blockquote {
margin:1.5em 30px;
}

h1 {
font-size:2em;
line-height:1.5em;
margin-top:.75em;
margin-bottom:.75em;
}

h2 {
font-size:1.5em;
line-height:2em;
margin-top:1em;
margin-bottom:1em;
}

h3 {
font-size:1.17em;
line-height:1.28205em;
margin-top:1.28205em;
margin-bottom:1.28205em;
}

h4 {
font-size:1em;
line-height:1.5em;
margin-top:1.5em;
margin-bottom:1.5em;
}

h5 {
font-size:.83em;
line-height:1.80723em;
margin-top:1.80723em;
margin-bottom:1.80723em;
}

h6 {
font-size:.67em;
line-height:2.23881em;
margin-top:2.23881em;
margin-bottom:2.23881em;
}

abbr[title] {
border-bottom:1px dotted;
}

dfn {
font-style:italic;
}

hr {
-webkit-box-sizing:content-box;
-moz-box-sizing:content-box;
box-sizing:content-box;
height:0;
border:1px solid #666;
padding-bottom:-1px;
margin:1.5em 0;
}

mark {
background:#ff0;
color:#000;
}

code,kbd,pre,samp,tt,var {
font-family:"Courier New","DejaVu Sans Mono",monospace,sans-serif;
_font-family:'courier new', monospace;
font-size:1em;
line-height:1.5em;
}

pre {
white-space:pre-wrap;
word-wrap:break-word;
}

q {
quotes:\201C \201D \2018 \2019;
}

small {
font-size:80%;
}

sub,sup {
font-size:75%;
line-height:0;
position:relative;
vertical-align:baseline;
}

sup {
top:-.5em;
}

sub {
bottom:-.25em;
}

dd {
margin:0 0 0 30px;
}

menu,ol,ul {
padding:0 0 0 30px;
}

nav ul,nav ol {
list-style:none;
list-style-image:none;
}

img {
border:0;
-ms-interpolation-mode:bicubic;
max-width:100%;
height:auto;
width:auto;
}

svg:not(:root) {
overflow:hidden;
}

fieldset {
border-color:silver;
border-style:solid;
border-width:.0625em;
margin:0 2px;
padding:.4625em .9125em .9125em;
}

legend {
border:0;
margin-left:-7px;
padding:0;
}

button,input {
line-height:normal;
}

button,select {
text-transform:none;
}

button,html input[type=button],input[type=reset],input[type=submit] {
-webkit-appearance:button;
cursor:pointer;
overflow:visible;
}

button[disabled],html input[disabled] {
cursor:default;
}

input[type=checkbox],input[type=radio] {
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
height:13px;
width:13px;
padding:0;
}

input[type=search] {
-webkit-appearance:textfield;
-webkit-box-sizing:content-box;
-moz-box-sizing:content-box;
box-sizing:content-box;
}

input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration {
-webkit-appearance:none;
}

button::-moz-focus-inner,input::-moz-focus-inner {
border:0;
padding:0;
}

textarea {
overflow:auto;
vertical-align:top;
}

label {
display:block;
font-weight:700;
}

table {
border-collapse:collapse;
border-spacing:0;
margin-top:1.5em;
margin-bottom:1.5em;
}

#page,.region-bottom {
margin-left:auto;
margin-right:auto;
max-width:1200px;
}

#header,#content,#navigation,.region-sidebar-first,.region-sidebar-second,#footer {
padding-left:10px;
padding-right:10px;
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
-ms-box-sizing:border-box;
box-sizing:border-box;
word-wrap:break-word;
behavior:url(/path/to/boxsizing.htc);
_display:inline;
_overflow:hidden;
_overflow-y:visible;
}

#header,#main,#footer {
position:relative;
zoom:1;
}

#header:before,#header:after,#main:before,#main:after,#footer:before,#footer:after {
content:"";
display:table;
}

.with-wireframes #header,.with-wireframes #main,.with-wireframes #content,.with-wireframes #navigation,.with-wireframes .region-sidebar-first,.with-wireframes .region-sidebar-second,.with-wireframes #footer,.with-wireframes .region-bottom {
outline:1px solid #ccc;
}

.lt-ie8 .with-wireframes #header,.lt-ie8 .with-wireframes #main,.lt-ie8 .with-wireframes #content,.lt-ie8 .with-wireframes #navigation,.lt-ie8 .with-wireframes .region-sidebar-first,.lt-ie8 .with-wireframes .region-sidebar-second,.lt-ie8 .with-wireframes #footer,.lt-ie8 .with-wireframes .region-bottom {
border:1px solid #ccc;
}

.element-invisible,.element-focusable,#navigation .block-menu .block__title,#navigation .block-menu-block .block__title {
position:absolute!important;
height:1px;
width:1px;
overflow:hidden;
clip:rect(1px,1px,1px,1px);
}

.element-focusable:active,.element-focusable:focus {
position:static!important;
clip:auto;
height:auto;
width:auto;
overflow:auto;
}

#skip-link a,#skip-link a:visited {
display:block;
width:100%;
text-align:center;
background-color:#666;
color:#fff;
padding:2px 0 3px;
}

.header__logo {
float:left;
margin:0;
padding:0;
}

.header__logo-image {
vertical-align:bottom;
}

.header__name-and-slogan {
float:left;
}

.header__site-name {
font-size:2em;
line-height:1.5em;
margin:0;
}

.header__site-link:link,.header__site-link:visited {
color:#000;
text-decoration:none;
}

.header__site-link:hover,.header__site-link:focus {
text-decoration:underline;
}

.header__secondary-menu {
float:right;
}

#navigation .links,#navigation .menu {
text-align:left;
margin:0;
padding:0;
}

#navigation .links li,#navigation .menu li {
float:left;
list-style-type:none;
list-style-image:none;
padding:0 10px 0 0;
}

.breadcrumb li {
display:inline;
list-style-type:none;
margin:0;
padding:0;
}

.messages,.messages--status,.messages--warning,.messages--error {
background-image:url(../images/message-24-ok.png);
background-position:8px 8px;
background-repeat:no-repeat;
border:1px solid #be7;
margin:1.5em 0;
padding:10px 10px 10px 50px;
}

.messages--warning {
background-image:url(../images/message-24-warning.png);
border-color:#ed5;
}

.messages--error {
background-image:url(../images/message-24-error.png);
border-color:#ed541d;
}

.messages__item {
list-style-image:none;
}

.messages--error p.error {
color:#333;
}

.ok,.messages--status {
background-color:#f8fff0;
color:#234600;
}

.warning,.messages--warning {
background-color:#fffce5;
color:#840;
}

.error,.messages--error {
background-color:#fef5f1;
color:#8c2e0b;
}

.tabs-primary,.tabs-secondary {
overflow:hidden;
zoom:1;
background-image:linear-gradient(bottom,#bbbbbb1px,transparent1px);
list-style:none;
border-bottom:1px solid #bbb \0/ie;
white-space:nowrap;
margin:1.5em 0;
padding:0 2px;
}

.tabs-primary__tab,.tabs-secondary__tab,.tabs-secondary__tab.is-active {
float:left;
margin:0 3px;
}

a.tabs-primary__tab-link,a.tabs-secondary__tab-link {
border:1px solid #e9e9e9;
border-right:0;
border-bottom:0;
display:block;
line-height:1.5em;
text-decoration:none;
}

.tabs-primary__tab,.tabs-primary__tab.is-active {
-moz-border-radius-topleft:4px;
-webkit-border-top-left-radius:4px;
border-top-left-radius:4px;
-moz-border-radius-topright:4px;
-webkit-border-top-right-radius:4px;
border-top-right-radius:4px;
text-shadow:1px 1px 0 #fff;
border:1px solid #bbb;
border-bottom-color:transparent;
border-bottom:0 \0/ie;
}

.is-active.tabs-primary__tab {
border-bottom-color:#fff;
}

a.tabs-primary__tab-link,a.tabs-primary__tab-link.is-active {
-moz-border-radius-topleft:4px;
-webkit-border-top-left-radius:4px;
border-top-left-radius:4px;
-moz-border-radius-topright:4px;
-webkit-border-top-right-radius:4px;
border-top-right-radius:4px;
-webkit-transition:background-color .3s;
-moz-transition:background-color .3s;
-o-transition:background-color .3s;
transition:background-color .3s;
color:#333;
background-color:#dedede;
letter-spacing:1px;
text-align:center;
padding:0 1em;
}

a.tabs-primary__tab-link:hover,a.tabs-primary__tab-link:focus {
background-color:#e9e9e9;
border-color:#f2f2f2;
}

a.tabs-primary__tab-link:active,a.tabs-primary__tab-link.is-active {
background-color:transparent;
zoom:1;
filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#FFE9E9E9',endColorstr='#00E9E9E9');
background-image:linear-gradient(#e9e9e9,rgba(233,233,233,0));
border-color:#fff;
}

.tabs-secondary {
font-size:.9em;
margin-top:-1.5em;
}

.tabs-secondary__tab,.tabs-secondary__tab.is-active {
margin:.75em 3px;
}

a.tabs-secondary__tab-link,a.tabs-secondary__tab-link.is-active {
-webkit-border-radius:.75em;
-moz-border-radius:.75em;
-ms-border-radius:.75em;
-o-border-radius:.75em;
border-radius:.75em;
-webkit-transition:background-color .3s;
-moz-transition:background-color .3s;
-o-transition:background-color .3s;
transition:background-color .3s;
text-shadow:1px 1px 0 #fff;
background-color:#f2f2f2;
color:#666;
padding:0 .5em;
}

a.tabs-secondary__tab-link:hover,a.tabs-secondary__tab-link:focus {
background-color:#dedede;
color:#333;
border-color:#999;
}

a.tabs-secondary__tab-link:active,a.tabs-secondary__tab-link.is-active {
text-shadow:1px 1px 0 #333;
background-color:#666;
color:#fff;
border-color:#000;
}

.inline {
display:inline;
padding:0;
}

.inline li {
display:inline;
list-style-type:none;
padding:0 1em 0 0;
}

span.field-label {
padding:0 1em 0 0;
}

.more-help-link a {
background-image:url(../images/help.png);
background-position:0 50%;
background-repeat:no-repeat;
padding:1px 0 1px 20px;
}

.pager {
clear:both;
text-align:center;
padding:0;
}

.pager-item,.pager-first,.pager-previous,.pager-next,.pager-last,.pager-ellipsis,.pager-current {
display:inline;
list-style-type:none;
background-image:none;
padding:0 .5em;
}

.block {
margin-bottom:1.5em;
}

.menu__item.is-leaf {
list-style-image:url(../images/menu-leaf.png);
list-style-type:square;
}

.menu__item.is-expanded {
list-style-image:url(../images/menu-expanded.png);
list-style-type:circle;
}

.menu__item.is-collapsed {
list-style-image:url(../images/menu-collapsed.png);
list-style-type:disc;
}

.menu a.active {
color:#000;
}

.new,.update {
color:#c00;
background-color:transparent;
}

.unpublished {
height:0;
overflow:visible;
background-color:transparent;
color:#d8d8d8;
font-size:75px;
line-height:1;
font-family:Impact, "Arial Narrow", Helvetica, sans-serif;
font-weight:700;
text-transform:uppercase;
text-align:center;
word-wrap:break-word;
}

.lt-ie8 .node-unpublished>*,.lt-ie8 .comment-unpublished>* {
position:relative;
}

.comment-preview {
background-color:#ffffea;
}

.comment .permalink {
text-transform:uppercase;
font-size:75%;
}

.indented {
margin-left:30px;
}

.form-item input.error,.form-item textarea.error,.form-item select.error {
border:1px solid #c00;
}

.form-item .description {
font-size:.85em;
}

.form-type-radio .description,.form-type-checkbox .description {
margin-left:2.4em;
}

.form-required {
color:#c00;
}

label.option {
display:inline;
font-weight:400;
}

a.button {
-webkit-appearance:button;
-moz-appearance:button;
appearance:button;
}

#user-login-form {
text-align:left;
}

.openid-link,.user-link {
margin-top:1.5em;
}

html.js #user-login-form li.openid-link,#user-login-form li.openid-link {
margin-left:-20px;
}

form th {
text-align:left;
padding-right:1em;
border-bottom:3px solid #ccc;
}

form tbody {
border-top:1px solid #ccc;
}

tr.even,tr.odd {
background-color:#eee;
border-bottom:1px solid #ccc;
padding:.1em .6em;
}

tr.even {
background-color:#fff;
}

.lt-ie8 tr.even th,.lt-ie8 tr.even td,.lt-ie8 tr.odd th,.lt-ie8 tr.odd td {
border-bottom:1px solid #ccc;
}

td.active {
background-color:#ddd;
}

td.checkbox,th.checkbox {
text-align:center;
}

td.menu-disabled {
background:#ccc;
}

#autocomplete .selected {
background:#0072b9;
color:#fff;
}

html.js .collapsible .fieldset-legend {
background-image:url(../images/menu-expanded.png);
background-position:5px 65%;
background-repeat:no-repeat;
padding-left:15px;
}

html.js .collapsed .fieldset-legend {
background-image:url(../images/menu-collapsed.png);
background-position:5px 50%;
}

.fieldset-legend .summary {
color:#999;
font-size:.9em;
margin-left:.5em;
}

tr.drag {
background-color:#fffff0;
}

tr.drag-previous {
background-color:#ffd;
}

.tabledrag-toggle-weight {
font-size:.9em;
}

tr.selected td {
background:#ffc;
}

.progress .bar {
background:#ccc;
-webkit-border-radius:3px;
-moz-border-radius:3px;
-ms-border-radius:3px;
-o-border-radius:3px;
border-radius:3px;
border-color:#666;
margin:0 .2em;
}

.progress .filled {
background-color:#0072b9;
background-image:url(../images/progress.gif);
}

body,.breadcrumb ol {
margin:0;
padding:0;
}

p,pre,dl,menu,ol,ul,.comments,.form-item,#user-login ul {
margin:1.5em 0;
}

b,strong,.pager-current,.progress {
font-weight:700;
}

ol ol,ol ul,ul ol,ul ul,figure,form,#skip-link,.header__site-slogan,.page__title,.node__title,.block__title,.comments__title,.comments__form-title,.comment__title,.messages__list,.form-checkboxes .form-item,.form-radios .form-item,tr.odd .form-item,tr.even .form-item,.password-parent,.confirm-parent,form table ul {
margin:0;
}

#header:after,#main:after,#footer:after,.header__region {
clear:both;
}

#navigation .block,.openid-links {
margin-bottom:0;
}

.more-link,.more-help-link {
text-align:right;
}

@media all and min-width 480px {
#main {
padding-top:3em;
position:relative;
}

#navigation {
position:absolute;
top:0;
height:3em;
width:100%;
}
}

@media all and min-width 480px and max-width 959px {
.sidebar-second #content {
float:left;
width:66.66667%;
margin-left:0;
margin-right:-66.66667%;
}

.two-sidebars .region-sidebar-second {
float:left;
width:100%;
margin-left:0;
margin-right:-100%;
padding-left:0;
padding-right:0;
clear:left;
}

.two-sidebars .region-sidebar-second .block {
padding-left:10px;
padding-right:10px;
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
-ms-box-sizing:border-box;
box-sizing:border-box;
word-wrap:break-word;
behavior:url(/path/to/boxsizing.htc);
_display:inline;
_overflow:hidden;
_overflow-y:visible;
}

.two-sidebars .region-sidebar-second .block:nth-child(3n+1) {
float:left;
width:33.33333%;
margin-left:0;
margin-right:-33.33333%;
clear:left;
}

.two-sidebars .region-sidebar-second .block:nth-child(3n+2) {
float:left;
width:33.33333%;
margin-left:33.33333%;
margin-right:-66.66667%;
}

.sidebar-first #content,.two-sidebars #content {
float:left;
width:66.66667%;
margin-left:33.33333%;
margin-right:-100%;
}

.sidebar-first .region-sidebar-first,.two-sidebars .region-sidebar-first {
float:left;
width:33.33333%;
margin-left:0;
margin-right:-33.33333%;
}

.sidebar-second .region-sidebar-second,.two-sidebars .region-sidebar-second .block:nth-child(3n) {
float:left;
width:33.33333%;
margin-left:66.66667%;
margin-right:-100%;
}
}

@media all and min-width 960px {
.sidebar-first #content {
float:left;
width:80%;
margin-left:20%;
margin-right:-100%;
}

.sidebar-second #content {
float:left;
width:80%;
margin-left:0;
margin-right:-80%;
}

.two-sidebars #content {
float:left;
width:60%;
margin-left:20%;
margin-right:-80%;
}

.sidebar-first .region-sidebar-first,.two-sidebars .region-sidebar-first {
float:left;
width:20%;
margin-left:0;
margin-right:-20%;
}

.sidebar-second .region-sidebar-second,.two-sidebars .region-sidebar-second {
float:left;
width:20%;
margin-left:80%;
margin-right:-100%;
}
}

@media print {
a:link,a:visited {
text-decoration:underline!important;
}

a:link.header__site-link,a:visited.header__site-link {
text-decoration:none!important;
}

#content a[href]:after {
content:" (" attr(href) ")";
font-weight:400;
font-size:16px;
}

#content a[href^=javascript:]:after,#content a[href^=#]:after {
content:"";
}

#content abbr[title]:after {
content:" (" attr(title) ")";
}

#content {
float:none!important;
width:100%!important;
margin:0!important;
padding:0!important;
}

body,#page,#main,#content {
color:#000;
background-color:transparent!important;
background-image:none!important;
}

#skip-link,#toolbar,#navigation,.region-sidebar-first,.region-sidebar-second,#footer,.breadcrumb,.tabs,.action-links,.links,.book-navigation,.forum-topic-navigation,.pager,.feed-icons {
visibility:hidden;
display:none;
}
}





/* -- Pictonio -- */

.vlogo {
    /* max-width: 15%;
    width: 150px; */
    /*max-width: 60%;*/
    background: none repeat scroll 0 0 rgba(0,0,0,0.0);
    padding: 0 2em 0 2em;
    /*max-height: 30%;*/
    height: auto;
    width: auto;
}

.vname {
max-width: 200px;
}

.opac {
  /* background: none repeat scroll 0 0 #646464; */
  margin: auto;
  /*max-width: 30%;
   opacity: 0.8; */
  /* width: 600px; */
  padding: 10px;
  /* overflow: auto; */
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
  margin-top: 30px;
}

.opacin {
width: 100%;
height: 100%;

}

h1{
color: grey;
font-size: 2em;
font-weight: bold;
line-height: 1.2;
margin-bottom: 0.1em;
margin-top: 0px;
}

h2{
color: grey;
font-size: 1em;
font-weight: 300;
line-height: 1.2;
margin:0px;
text-shadow: 0 0 3px rgba(250, 250, 250, 1);
}


.vcenter a{
color: white;
text-decoration: none;
line-height: 200%;
background: rgb(242,156,22);
padding: .5em 1.2em;
font-size: 90%;
/* float: left;
 -webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px; */
}

.vcenter a:hover {
background: rgb(220,134,0);

}

.vcenter {
text-align: center;
display: table;
width: 100%;
height: 100%;
overflow: hidden;
position: fixed;
left: 0;
top: 0;

}

.vcenter2 {
display: table-cell;
vertical-align: middle;
overflow: visible;
}

.vcenter3 {
margin: 0 0 30px 0;
}

.video-pattern{
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAJElEQVQIW2NkwAT/GdHE/gP5jMiCYAGQIpggTACuEq4CatR/ABtJBwTL3L3TAAAAAElFTkSuQmCC) repeat;
}