﻿/* Style - www.netbax.net © January 2025 - Autor by Chris Bax - net@netbax.net */

body {
background-color:#000;
width: 100%; 
height:100%;
margin:0px;
padding:0px;
font-family:"Heebo",sans-serif;
font-size:1rem;
font-weight:400;
color:#fff;
-webkit-tap-highlight-color:rgba(0,0,0,0)}
*,*::before,*::after{box-sizing:border-box}


* {
    padding: 0px;
    margin: 0px;
    box-sizing: border-box;

}

::-webkit-selection { 
  color: #fff;
  background: #c00;
}

::-moz-selection { 
  color: #fff;
  background: #c00;
}

::selection {
 color: #fff;
  background: #c00;
}

.form-group{
margin-bottom:10px;
}

.checkbox {
     color: transparent;
     background: url('../../images/checkbox.png') -40px 0 no-repeat;
     border-radius: 14px;
     box-shadow: 0 1px 2px #888, 0 0px 3px #777, inset 0 -1px 5px #333;
     display: inline-block;
     position: relative;
     text-indent: 100%;
     width: 65px;
     height: 29px;
     -webkit-transition: background-position .3s ease;
     -moz-transition: background-position .3s ease;
     cursor: pointer;
     font-size: .01em;}

.check[type=checkbox] {
     display: none;}

.checkbox span {
     background: url('../../images/checkbox.png') -1px -30px no-repeat;
     border: 0px solid transparent;
     border-radius: 14px;
     box-shadow: 0 1px 3px #000, 0 2px 13px #000;
     content: "";
     display: block;
     position: absolute;
     top: 0px;
     left: -1px;
     width: 28px;
     height: 28px;
     -webkit-transition: left .3s ease;
     -moz-transition: left .3s ease;}

.check[type=checkbox]:checked + label {
     background-position: 0 0;}

.check[type=checkbox]:checked + label span {
     left: 40px;}















.flex{display:flex;overflow:none;}

.sidebar1{
height:600px;
width:27%;
background-color:#000;
position:fixed!important;
overflow:auto;
border-radius:0px;
box-shadow:1px 1px .5em #000 inset;
top:40px;
left:0px;
z-index:5;
padding:5px;}

.sidebar2{
height:100%;
width:58%;
background-color:#000;
  background-image: url(../../images/transparent.png);
position:fixed!important;
overflow-x:none;
border-radius:0px;
box-shadow:1px 1px .5em #000 inset;
top:40px;
right:170px;
z-index:5;}

.sidebar3{
height:485px;
width:13%;
background-color:#000;
position:fixed!important;
overflow:auto;
border-radius:0px;
box-shadow:1px 1px .5em #000 inset;
top:170px;
right:0px;
z-index:5;
padding:5px;
margin:0px;}

.sidebar4{
height:530px;
width:100%;
background-color:#000;
position:absolute!important;
overflow:auto;
border-radius:0px;
box-shadow:1px 1px .5em #000 inset;
top:70px;
left:0px;
z-index:5;
padding:5px;
margin:0px;}

.lock{
position:fixed;
top:50px;
right:19px;
border:none;
outline:none;
}



.coll1{
position:relative;
width: 322px;
height: 228px;
display: block;
z-index:1;
border: none;
margin-top:10px;
margin-left:10px;
}






   










.out {
background: radial-gradient(circle at 10.6% 22.1%, rgb(206, 18, 18) 0%, rgb(122, 21, 21) 100.7%);
  padding: 7px 10px;
border-radius:4px 0px 0px 4px;


  color: #fff;
}


input,
output {
  display: inline-block;
  vertical-align: middle;
  font-size: 14px;
  font-family: Arial, sans-serif;
}

output {
background: #c00;
padding: 7px 7px;
color: #fff;
border-radius:2px;
border:none;

}




.input1{


width:140px;
height:30px;
cursor: pointer;
display: inline-block;
  vertical-align: middle;
  font-size: 14px;
background-color:#c00;
border-radius:0px 4px 4px 0px;
color:#fff;
border:0px;
}

.input1:hover {
    background-color: #555;
border-right:4px solid #c00;
}















.button5 {
font-size: 15px;
  min-width: 25px;
  height: 30px;


  font-weight: normal;
  cursor: pointer;
  transition: all 0.3s ease;
  position: relative;
  display: inline-block;
  outline: none;
  border-radius: 2px;
  z-index: 0;
background: #008000;
  overflow: hidden;
  border: 1px solid #008000;
  color: #fff;

}
.button5:hover {
  color: #fff;
border-color: #555;
}
.button5:hover:after {
  width: 100%;
}
.button5:after {
  content: "";
  position: absolute;
  z-index: -1;
  transition: all 0.3s ease;
  left: 0;
  top: 0;
  width: 0;
  height: 100%;
background: #777;
}











.button55 {
font-size: 15px;
  min-width: 25px;
  height: 30px;


  font-weight: normal;
  cursor: pointer;
  transition: all 0.3s ease;
  position: relative;
  display: inline-block;
  outline: none;
  border-radius: 2px;
  z-index: 0;
background: #ff3800;
  overflow: hidden;
  border: 1px solid #ff3800;
  color: #fff;

}
.button55:hover {
  color: #fff;
border-color: #555;
}
.button55:hover:after {
  width: 100%;
}
.button55:after {
  content: "";
  position: absolute;
  z-index: -1;
  transition: all 0.3s ease;
  left: 0;
  top: 0;
  width: 0;
  height: 100%;
background: #777;
}













.buts{
position:absolute;

right:440px;

}




textarea::placeholder {
  
    opacity: 1;
    color: #fff;
}








/* input[type="range"]:focus,
input[type="number"]:focus {
  box-shadow: 0 0 3px 1px #4b81dd;
  outline: none;
} */

input[type="range"] {
  -webkit-appearance: none;
  margin-right: 15px;
  width: 150px;
  height: 7px;
  background: rgba(255, 255, 255, 0.6);
  border-radius: 5px;
  background-image: linear-gradient(#c00, #ff4500);
  background-size: 70% 100%;
  background-repeat: no-repeat;
}


[dir="rtl"] input[type="range"] {
  background: #ff4500;
  background-image: linear-gradient(#fff, #fff);
  background-size: 30% 100%;
  background-repeat: no-repeat;
}

/* Input Thumb */
input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  height: 20px;
  width: 20px;
  border-radius: 50%;
  background: #ff4500;
  cursor: ew-resize;
  box-shadow: 0 0 2px 0 #555;
  transition: background .3s ease-in-out;
}

input[type="range"]::-moz-range-thumb {
  -webkit-appearance: none;
  height: 20px;
  width: 20px;
  border-radius: 50%;
  background: #ff4500;
  cursor: ew-resize;
  box-shadow: 0 0 2px 0 #555;
  transition: background .3s ease-in-out;
}

input[type="range"]::-ms-thumb {
  -webkit-appearance: none;
  height: 20px;
  width: 20px;
  border-radius: 50%;
  background: #ff4500;
  cursor: ew-resize;
  box-shadow: 0 0 2px 0 #555;
  transition: background .3s ease-in-out;
}

input[type="range"]::-webkit-slider-thumb:hover {
  background: #ff0200;
}

input[type="range"]::-moz-range-thumb:hover {
  background: #ff0200;
}

input[type="range"]::-ms-thumb:hover {
  background: #ff0200;
}

/* Input Track */
input[type=range]::-webkit-slider-runnable-track  {
  -webkit-appearance: none;
  box-shadow: none;
  border: none;
  background: transparent;
}

input[type=range]::-moz-range-track {
  -webkit-appearance: none;
  box-shadow: none;
  border: none;
  background: transparent;
}

input[type="range"]::-ms-track {
  -webkit-appearance: none;
  box-shadow: none;
  border: none;
  background: transparent;
}



































.select {
width:40%;
color:#fff;
position: relative;
  height: 28px;
  background: #363d47;
font-size:14px;
cursor: pointer;
  border: 1px solid;
  border-color: #272c33 #242930 #22272d;
border-radius:0px 4px 4px 0px;
  display: inline-block;
  vertical-align: baseline;
  zoom: 1;
  *display: inline;
  *vertical-align: auto;
  background-image: -webkit-linear-gradient(top, #4a5361, #363d47);
  background-image: -moz-linear-gradient(top, #4a5361, #363d47);
  background-image: -o-linear-gradient(top, #4a5361, #363d47);
  background-image: linear-gradient(to bottom, #4a5361, #363d47);
  -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.1), 0 1px 2px rgba(0, 0, 0, 0.15);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.1), 0 1px 2px rgba(0, 0, 0, 0.15);}

.select:hover{
  background-color: gray;
}


.input4{

margin-left:-4px;
width:40%;
height:30px;
cursor: pointer;
display: inline-block;
  vertical-align: middle;
  font-size: 14px;
color:#fff;
background-color: #555;
border-radius:0px;
border:0px;
}

.input4:hover {
    background-color: #777;
}

.oup3 {
background: #222;
  padding: 7px 15px;
margin-left:0px;
  color: #fff;
border-radius:4px 0px 0px 4px;
border:none;
box-shadow: inset 5px 5px 5px 5px rgba(0,0,0,0.4);}

.button {
  display: inline-block;
  padding: 12px 17px;
  border: 0px solid #000;
background: linear-gradient(107.2deg, rgb(150, 15, 15) 10.6%, rgb(247, 0, 0) 91.1%);
  cursor: pointer;
  transition: background-color 0.3s, color 0.3s;
font-size:15px;
font-family:tahoma;
text-transform:capitalize;
  color: #fff;
border-radius:2px;

}

.button:hover {
background: radial-gradient(circle at 50.4% 50.5%, rgb(251, 32, 86) 0%, rgb(135, 2, 35) 90%);
  color: #fff;
}

.input{
text-decoration: none;
width:70%;
height:34px;
padding:6px 12px;
font-size:14px;
color:#fff;
background-color:#222;
border-radius:4px;
border:1px solid #555;
box-shadow: inset 5px 5px 5px 5px rgba(0,0,0,0.4);
}

.input:hover {
    background-color: #222;

border-right:4px solid #c00;
}

.input::placeholder {
  
    opacity: 1;
    color: #fff;
}

.button4 {
  display: inline-block;

}

.button4 a {

  float: left;
  padding: 4px 10px;
  text-decoration: none;
  border-top: 1px solid #555;
  border-bottom: 1px solid #555;
transform: scale(1.05);
  
  background-image: linear-gradient( /* chrome */
    hsla(0, 0%, 100%, 0.6), hsla(0, 0%, 100%, 0) 50%,
    hsla(0, 0%, 0%, 0.3) 50%, hsla(0, 0%, 100%, 0.2)
  );

}



.button4 a:first-child {
  border-top-left-radius: 9px;
  border-bottom-left-radius: 9px;
  border: 1px solid #555;
}

.button4 a:last-child {
  border-top-right-radius: 9px;
  border-bottom-right-radius: 9px;
  border: 1px solid #555;
}









.xblack{background-color:#000;
border: 1px solid #000;}

.xwhite{background-color:#ccc;
border: 1px solid #ccc;}

.xred{background-color:#ff0000;
border: 1px solid #ff0000;}

.xorange{background-color:#FFAE00;
border: 1px solid #FFAE00;
}



.xblue{background-color:#007FFF;
border: 1px solid #007FFF;}

.xcoral{background-color:#ff9966;
border: 1px solid #ff9966;}

.xgreen{background-color:#008000;
border: 1px solid #008000;}

.air-force-blue{background-color:#5d8aa8;
border: 1px solid #5d8aa8;}

.aurometalsaurus{background-color:#6e7f80;
border: 1px solid #6e7f80;}

.beaver{background-color:#9f8170;
border: 1px solid #9f8170;}

.electric-green{background-color:#0f0;
border: 1px solid #0f0;}

.purple{background-color:#966fd6;
border: 1px solid #966fd6;}



















.x-bar{
  position: absolute;
  top: 0px;
  left: 0px;
padding:0px 0px;
margin:0px;}

.baxs { position:fixed;width:100%!important;background:#222;}


.baxs {    padding: 4px;  background-clip: padding-box;  border: 1px solid;  border-color: #070809 #0d0e0f #131517;  border-color: rgba(0, 0, 0, 0.8) rgba(0, 0, 0, 0.65) rgba(0, 0, 0, 0.5);  border-radius: 3px;  display: inline-block;  vertical-align: baseline;  zoom: 1;  *display: inline;  *vertical-align: auto;     background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.12), rgba(0, 0, 0, 0));  background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.12), rgba(0, 0, 0, 0));  background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.12), rgba(0, 0, 0, 0));  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.12), rgba(0, 0, 0, 0));  -webkit-box-shadow: 0 1px rgba(255, 255, 255, 0.05);  box-shadow: 0 1px rgba(255, 255, 255, 0.05);}

.baxs a {  float: left;  margin-left: 5px;  padding: 0px 9px;  min-width: 17px;  line-height: 27px;  font-family: tahoma;  font-size: 14px;  font-weight: 500;  color: #d4d4d4;  text-align: center;  text-decoration: none;  border: 1px solid black;  border-radius: 3px;text-transform:capitalize;}

.baxs :first-child {  margin-left: 0px;}

.baxs a {  text-decoration: none;  text-shadow: 0 1px black;  background-clip: padding-box;  border-color: rgba(0, 0, 0, 0.9);  background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0));  background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0));  background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0));  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0));  -webkit-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04), inset 0 1px rgba(255, 255, 255, 0.04), inset 0 -1px rgba(0, 0, 0, 0.15), 0 1px 1px rgba(0, 0, 0, 0.1);  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04), inset 0 1px rgba(255, 255, 255, 0.04), inset 0 -1px rgba(0, 0, 0, 0.15), 0 1px 1px rgba(0, 0, 0, 0.1);  -webkit-transition: 0.1s ease-out;  -moz-transition: 0.1s ease-out;  -o-transition: 0.1s ease-out;  transition: 0.1s ease-out;}

.baxs  a:hover {  background-color: #333;  background-color: rgba(255, 255, 255, 0.05);}

.baxs a:active {  color: #eee;  text-shadow: 0 -1px black;  background: #1c1c1c;  background: rgba(255, 255, 255, 0.01);  border-color: black rgba(0, 0, 0, 0.65) rgba(0, 0, 0, 0.6);  -webkit-box-shadow: inset 0 1px rgba(0, 0, 0, 0.05), inset 0 2px 2px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.06);  box-shadow: inset 0 1px rgba(0, 0, 0, 0.05), inset 0 2px 2px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.06);}


#collage{
position:absolute;
right:8px;
top:2px;
width: 750px;
height: 605px;
background-image: url(../../images/texture/16.png);
display: inline-block;
z-index:20;
border: none;
}

.co1{
border:none;
object-fit:cover;
z-index:3;
cursor: pointer;
outline:none;}

.co2{
border:none;
object-fit:cover;
z-index:3;
cursor: pointer;
outline:none;}

.co3{
border:none;
object-fit:cover;
z-index:3;
cursor: pointer;
outline:none;}

.co4{
border:none;
object-fit:cover;
z-index:3;
cursor: pointer;
outline:none;}

.co5{
border:none;
object-fit:cover;
z-index:3;
cursor: pointer;
outline:none;}




.x1{
width: 240px;
height: 160px;
transform: rotate(20deg);
border: 1px solid #000;
object-fit:cover;
z-index:1;
cursor: pointer;
outline:none;}

.x1t{
transform: rotate(20deg);
z-index:999;
font-family:lucida;
font-size: 27px;
font-weight: normal;
color:#fff;}

.x2{
width: 340px;
height: 197px;
border: 1px solid #000;
object-fit:cover;
z-index:2;
cursor: pointer;}

.x2t{
z-index:999;
font-family:lucida;
font-size: 27px;
font-weight: normal;
color:#fff;}

.x3{
width: 240px;
height: 160px;
transform: rotate(-20deg);
cursor: pointer;
border: 1px solid #000;
object-fit:cover;
z-index:1;}

.x3t{
transform: rotate(-20deg);
z-index:999;
font-family:lucida;
font-size: 27px;
font-weight: normal;
color:#fff;}


.x4{
width: 200px;
height: 200px;
-webkit-border-radius:50%;
-moz-border-radius:50%;
border-radius:50%;
border: 1px solid #000;
object-fit:cover;
z-index:1;
cursor: pointer;}

.x4t{
z-index:999;
font-family:lucida;
font-size: 30px;
font-weight: normal;
color:#fff;}

.x5{
width: 200px;
height: 133px;
transform: rotate(-10deg);
border: 1px solid #000;
object-fit:cover;
z-index:2;
cursor: pointer;}

.x5t{
transform: rotate(-10deg);
z-index:999;
font-family:lucida;
font-size: 27px;
font-weight: normal;
color:#fff;}



.x6{
width: 150px;
height: 150px;
-webkit-border-radius:50%;
-moz-border-radius:50%;
border-radius:50%;
border: 1px solid #000;
object-fit:cover;
z-index:2;
cursor: pointer;}

.x6t{

z-index:999;
font-family:lucida;
font-size: 27px;
font-weight: normal;
color:#fff;}


.x7{
width: 120px;
height: 120px;
-webkit-border-radius:50%;
-moz-border-radius:50%;
border-radius:50%;
border: 1px solid #000;
object-fit:cover;
z-index:2;
cursor: pointer;}

.x7t{

z-index:999;
font-family:lucida;
font-size: 25px;
font-weight: normal;
color:#fff;}

.x8{
width: 200px;
height: 134px;
transform: rotate(-10deg);
border: 1px solid #000;
object-fit:cover;
z-index:1;
cursor: pointer;}

.x8t{
transform: rotate(-10deg);
z-index:999;
font-family:lucida;
font-size: 27px;
font-weight: normal;
color:#fff;}

.x9{
width: 300px;
height: 202px;
border: 1px solid #000;
object-fit:cover;
z-index:1;
cursor: pointer;}

.x9t{
z-index:999;
font-family:lucida;
font-size: 27px;
font-weight: normal;
color:#fff;}



.x10{
width: 200px;
height: 278px;
transform: rotate(10deg);
border: 1px solid #000;
object-fit:cover;
z-index:1;
cursor: pointer;}

.x10t{
height: 278px;
transform: rotate(10deg);
z-index:999;
font-family:lucida;
font-size: 27px;
font-weight: normal;
color:#fff;}


[draggable=true] {
  user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
}

.draggable {
cursor:move;
position:absolute;
top:0px;
left:160px;
z-index:20;}


.draggable1 {
cursor:move;
position:absolute;
left:20px;
top:40px;}

.draggable2 {
cursor:move;
position:absolute;
right:200px;
top:40px;}

.draggable3 {
cursor:move;
position:absolute;
right:20px;
top:40px;}

.draggable4 {
cursor:move;
position:absolute;
left:10px;
top:220px;}

.draggable5 {
cursor:move;
position:absolute;
left:215px;
bottom:220px;}

.draggable6 {
cursor:move;
position:absolute;
right:190px;
top:240px;}

.draggable7 {
cursor:move;
position:absolute;
right:20px;
top:190px;}

.draggable8 {
cursor:move;
position:absolute;
left:20px;
bottom:25px;}



.draggable9 {
cursor:move;
position:absolute;
left:212px;
bottom:4px;}

.draggable10 {
cursor:move;
position:absolute;
right:25px;
top:310px;}


.draggable11 {
cursor:move;
position:absolute;
left:20px;
top:40px;}


.draggable12 {
cursor:move;
position:absolute;
left:20px;
top:40px;}

.draggable13 {
cursor:move;
position:absolute;
left:50px;
top:20px;}

.draggable14 {
cursor:move;
position:absolute;
right:250px;
top:40px;}


.draggable15 {
cursor:move;
position:absolute;
right:250px;
top:40px;}


.draggable16 {
cursor:move;
position:absolute;
right:250px;
top:40px;}

.draggable17 {
cursor:move;
position:absolute;
right:20px;
top:40px;}

.draggable18 {
cursor:move;
position:absolute;
right:20px;
top:40px;}

.draggable19 {
cursor:move;
position:absolute;
right:20px;
top:40px;}




.draggable35 {
cursor:move;
position:absolute;
left:262px;
bottom:4px;}

.draggable36 {
cursor:move;
position:absolute;
left:262px;
bottom:4px;}

.draggable37 {
cursor:move;
position:absolute;
left:262px;
bottom:4px;}

.draggable38 {
cursor:move;
position:absolute;
right:30px;
top:295px;}

.draggable39 {
cursor:move;
position:absolute;
right:30px;
top:295px;}

.draggable40 {
cursor:move;
position:absolute;
right:30px;
top:295px;}

.draggable41 {
cursor:move;
position:absolute;
left:25px;
bottom:25px;}

.draggable42 {
cursor:move;
position:absolute;
left:25px;
bottom:25px;}

.draggable43 {
cursor:move;
position:absolute;
left:25px;
bottom:25px;}

.draggable44 {
cursor:move;
position:absolute;
left:250px;
bottom:210px;}

.draggable45 {
cursor:move;
position:absolute;
left:250px;
bottom:210px;}

.draggable46 {
cursor:move;
position:absolute;
left:250px;
bottom:210px;}

.draggable47 {
cursor:move;
position:absolute;
left:20px;
top:220px;}

.draggable48 {
cursor:move;
position:absolute;
right:225px;
top:240px;}

.draggable49 {
cursor:move;
position:absolute;
right:20px;
top:170px;}

.draggable50 {
cursor:move;
position:absolute;
left:20px;
top:40px;}

.draggable51 {
cursor:move;
position:absolute;
left:20px;
top:40px;}

.draggable52 {
cursor:move;
position:absolute;
left:20px;
top:40px;}

.draggable53 {
cursor:move;
position:absolute;
left:20px;
top:40px;}

.draggable54 {
cursor:move;
position:absolute;
left:20px;
top:40px;}

.x1s, .x1s1, .x2s, .x2s2, .x3s, .x3s3, .x9s, .x9s9, .x10s, .x10s10, .x8s, .x8s8, .x5s, .x5s5 {
z-index:999;}







.pages{
 
padding:10px;
margin:4px;}

.sel{
background-color:#000;
border:1px solid #000;
vertical-align:bottom;
cursor:pointer;
border-radius:4px;}

.tops {
font-family:impact;
font-size:30px;
color:#fff;
font-weight:normal;
font-style:normal;
text-transform: none;
display:inline-block;
letter-spacing:0px;
-webkit-text-stroke:1.27px #000;
}

.cupa1 {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 3;
    top: 0;
    left:0;
    background-color: #0d0d0d;
    overflow-y: auto;
    overflow-x: hidden;
    text-align: center;
    opacity:0;
    transition: opacity 1s;

}

.cupa4 {
    height: 500px;
    width: 0;
    top: 60px;
    left: 0;
    background-color: #0d0d0d;
    position: fixed;
    z-index: 3;
    overflow-x: hidden;
    transition: .5s;
    padding-top: 60px;
}
.cupa4 a{ 
    padding: 0px 0px 0px 4px;
    text-decoration: none !important;
    font-size: 40px;
    color: #fff;
    display: initial;
    transition: .3s;
}
.cupa4 a:hover, .cup4 a:focus{
    color: #ccc;
}
.cupa2 {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 40px !important;
    margin-left: 50px;

}






.cupb1 {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 3;
    top: 0;
    left:0;
    background-color: #0d0d0d;
    overflow-y: auto;
    overflow-x: hidden;
    text-align: center;
    opacity:0;
    transition: opacity 1s;

}

.cupb4 {
    height: 500px;
    width: 0;
    top: 60px;
    left: 0;
    background-color: #0d0d0d;
    position: fixed;
    z-index: 3;
    overflow-x: hidden;
    transition: .5s;
    padding-top: 60px;
}
.cupb4 a{ 
    padding: 0px 0px 0px 4px;
    text-decoration: none !important;
    font-size: 40px;
    color: #fff;
    display: initial;
    transition: .3s;
}
.cupb4 a:hover, .cup4 a:focus{
    color: #ccc;
}
.cupb2 {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 40px !important;
    margin-left: 50px;

}










.cupc1 {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 3;
    top: 0;
    left:0;
    background-color: #0d0d0d;
    overflow-y: auto;
    overflow-x: hidden;
    text-align: center;
    opacity:0;
    transition: opacity 1s;

}

.cupc4 {
    height: 500px;
    width: 0;
    top: 60px;
    left: 0;
    background-color: #0d0d0d;
    position: fixed;
    z-index: 3;
    overflow-x: hidden;
    transition: .5s;
    padding-top: 60px;
}
.cupc4 a{ 
    padding: 0px 0px 0px 4px;
    text-decoration: none !important;
    font-size: 40px;
    color: #fff;
    display: initial;
    transition: .3s;
}
.cupc4 a:hover, .cup4 a:focus{
    color: #ccc;
}
.cupc2 {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 40px !important;
    margin-left: 50px;

}








.cupi1 {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 3;
    top: 0;
    left:0;
    background-color: #0d0d0d;
    overflow-y: auto;
    overflow-x: hidden;
    text-align: center;
    opacity:0;
    transition: opacity 1s;

}

.cupi4 {
    height: 500px;
    width: 0;
    top: 60px;
    left: 0;
    background-color: #0d0d0d;
    position: fixed;
    z-index: 3;
    overflow-x: hidden;
    transition: .5s;
    padding-top: 60px;
}
.cupi4 a{ 
    padding: 0px 0px 0px 4px;
    text-decoration: none !important;
    font-size: 40px;
    color: #fff;
    display: initial;
    transition: .3s;
}
.cupi4 a:hover, .cup4 a:focus{
    color: #ccc;
}
.cupi2 {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 40px !important;
    margin-left: 50px;

}



.cupj1 {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 3;
    top: 0;
    left:0;
    background-color: #0d0d0d;
    overflow-y: auto;
    overflow-x: hidden;
    text-align: center;
    opacity:0;
    transition: opacity 1s;

}

.cupj4 {
    height: 500px;
    width: 0;
    top: 60px;
    left: 0;
    background-color: #0d0d0d;
    position: fixed;
    z-index: 3;
    overflow-x: hidden;
    transition: .5s;
    padding-top: 60px;
}
.cupj4 a{ 
    padding: 0px 0px 0px 4px;
    text-decoration: none !important;
    font-size: 40px;
    color: #fff;
    display: initial;
    transition: .3s;
}
.cupj4 a:hover, .cup4 a:focus{
    color: #ccc;
}
.cupj2 {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 40px !important;
    margin-left: 50px;

}


















.cuph1 {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 3;
    top: 0;
    left:0;
    background-color: #0d0d0d;
    overflow-y: auto;
    overflow-x: hidden;
    text-align: center;
    opacity:0;
    transition: opacity 1s;

}

.cuph4 {
    height: 500px;
    width: 0;
    top: 60px;
    left: 0;
    background-color: #0d0d0d;
    position: fixed;
    z-index: 3;
    overflow-x: hidden;
    transition: .5s;
    padding-top: 60px;
}
.cuph4 a{ 
    padding: 0px 0px 0px 4px;
    text-decoration: none !important;
    font-size: 40px;
    color: #fff;
    display: initial;
    transition: .3s;
}
.cuph4 a:hover, .cup4 a:focus{
    color: #ccc;
}
.cuph2 {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 40px !important;
    margin-left: 50px;

}












.cupe1 {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 3;
    top: 0;
    left:0;
    background-color: #0d0d0d;
    overflow-y: auto;
    overflow-x: hidden;
    text-align: center;
    opacity:0;
    transition: opacity 1s;

}

.cupe4 {
    height: 500px;
    width: 0;
    top: 60px;
    left: 0;
    background-color: #0d0d0d;
    position: fixed;
    z-index: 3;
    overflow-x: hidden;
    transition: .5s;
    padding-top: 60px;
}
.cupe4 a{ 
    padding: 0px 0px 0px 4px;
    text-decoration: none !important;
    font-size: 40px;
    color: #fff;
    display: initial;
    transition: .3s;
}
.cupe4 a:hover, .cup4 a:focus{
    color: #ccc;
}
.cupe2 {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 40px !important;
    margin-left: 50px;

}

.neon{

  background-color: #ff3800;
font-family: lucida;
font-size:20px;
font-weight:bold;

  color: #fff;
text-transform: capitalize;
border:1px solid #ff3800;
border-radius:4px;
}

.fa-file-image-o{color:#ffe135;}
.fa-arrow-right{color:#ffe135;}
.fa-upload{color:#ffe135;}
.fa-info-circle{color:#007FFF;}
.fa-exclamation-triangle{color:#ffe135;}



x999 {
  position: relative;
  display: inline-block;
margin-right: 0.4em;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  border-radius: 50%;
  width: 1.4em;
  height: 1.4em;
  font-weight: bold;
  line-height: 1.4;
  text-align: center;
  color: #000;
  font-size: 16px;
  background-color: #fff;
border:1px solid #000;
opacity:1;
}



.infos{ 
font-family: lucida;
font-size:27px;
text-transform: capitalize;
color: #fff;
font-weight:bold;
text-align:center;}


.welcome{
position:absolute;
left:7px;
top:90px;
border:1px solid #000;
padding:0px 10px;
  background-color: #000;
width: 320px;
height:500px;
  color: #fff;
font-family: tahoma;
font-size:17px;
text-transform: capitalize;
overflow:auto;
line-height:2;
 }

.fa-file-image-o{color:#ffe135;}
.fa-arrow-right{color:#ffe135;}
.fa-upload{color:#ffe135;}
.fa-info-circle{color:#007FFF;}
.fa-exclamation-triangle{color:#ffe135;}









.hide {
  width: 0.1px;
  height: 0.1px;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  z-index: -1;
}

label[for=imga] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=imga]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}

.joo{


border:none;
  display: inline;
  cursor: pointer;
  padding: 7px 10px 7px 5px;
  background-color: #FF5722;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
  border-radius: 0px;
  transition: all 0.3s;

}

.joo:hover {
  background-color: #ff3800;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}




.put4 {
background-color: #008000;
width:100%;
height:30px;
border-radius:2px;
  color: #fff;
text-align:center;
font-weight:bold;
font-family:tahoma;
font-size:15px;
text-transform:capitalize;
}




label[for=clip15] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=clip15]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}

label[for=clip16] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=clip16]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}

label[for=clip17] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=clip17]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}

label[for=clip18] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=clip18]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}

label[for=clip19] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=clip19]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}

label[for=iop1] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=iop1]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}




label[for=clip1] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=clip1]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}


label[for=clip2] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=clip2]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}




.bar {
  height: 100%;
  width: 0px;
  position: fixed;
  z-index: 1;
  top: 0px;
  left: 0px;
  background-color: #0d0d0d;
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 60px;
}

.bar a {
 padding: 0px 0px 0px 4px;
  text-decoration: none;

  display: inline;
  transition: 0.3s;
}



.bar .closebtn {
  position: absolute;
  top: 0px;
  right: 25px;
  font-size: 40px;
  margin-left: 50px;
color:#fff;
}

@media screen and (max-height: 450px) {
  .bar {padding-top: 15px;}

}

label[for=clip3] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=clip3]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}

label[for=clip4] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=clip4]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}

label[for=clip5] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=clip5]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}

label[for=clip6] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=clip6]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}

label[for=clip7] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=clip7]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}

label[for=clip8] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=clip8]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}

label[for=clip9] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=clip9]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}

label[for=clip10] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=clip10]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}

label[for=clip11] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=clip11]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}


label[for=clip12] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=clip12]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}

label[for=clip13] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=clip13]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}

label[for=clip14] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=clip14]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}

label[for=iop2] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=iop2]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}


label[for=iop3] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=iop3]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}


label[for=iop4] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=iop4]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}


label[for=iop5] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=iop5]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}

label[for=iop6] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=iop6]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}

label[for=iop7] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=iop7]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}


label[for=iop8] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=iop8]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}

label[for=iop9] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=iop9]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}

label[for=iop10] {
  display: inline;
  cursor: pointer;
  padding: 7px 20px 7px 5px;
  background-color: #ff3800;
font-family:lucida;
font-size:17px;
  color: #fff;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
   border-radius: 2px;
  transition: all 0.3s;
}
label[for=iop10]:hover {
  background-color: #FF5722;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25), 0 5px 18px 0 rgba(0, 0, 0, 0.2);
}