body{
    padding: 0;
    margin: 0;
	font-family: 'Open Sans', sans-serif;
}

#icon-holder{
width:100%;
float:left;

}
#divider h1{
    color: #003C81;
    font-size: 28px;
    text-align: center;
	font-family: 'Open Sans', sans-serif;
	font-weight:bold;
	padding: 0px;
}
.use h2{
    text-align: center;
    font-weight: bold;
    margin-bottom: 20px;
}
footer p{
text-align:center;
padding-top:20px;
padding-bottom:20px;

}
.butt {
    padding: 30px;
    margin: auto;
    display: table;
}
.use{
background:#DEDEDE;
}
.bot svg{
    float: left;
    margin-right: 11px;
}
.divcode{
overflow:hidden;
}
.bot button{
width: 135px;
    line-height: 32px;
}
.features{
background:#1A1A1A;
padding-top:30px;
}
.hf {
    width: 150px;
    height: 150px;
    border: solid 2px #0C6E88;
    border-radius: 75px;
    margin: auto;
	display:none;

}
#potr{
    position: fixed;
    font-size: 23px;
    left: 100%;
    margin-left: -85px;
    top: 100%;
    margin-top: -79px;
}
.features h2{
color:white;
text-align:center;
	margin-bottom:50px;
}
.hf svg {
margin-top:8px;
}
.circlb button{
    margin-right: 12px;
    padding: 10px;
    background: #3a5795;
    border: none;
    border-radius: 35px;
    margin-top: 20px;
}
.circlb button:nth-child(2){
    background: #4099FF;

}
.circlb button:nth-child(3){
    background: #C92228;
}
.circlb button:nth-child(4){
    background:  #c4302b;
}
.circlb button:last-child{
    background:#0e76a8;
}
.simple>div{
    padding-bottom: 10px;
    padding-top: 10px;
    background: #1A1A1A;
    border-right: solid 1px;
	border-bottom: solid #D6054A;
}
.simple>div:last-child{
    border-right: none;
	border-radius: 0px 10px 10px 0px;
}
.simple>div:first-child{
	border-radius: 10px 0px 0px 10px;
}
.dropdown-menu svg{
float: left;
 margin-right: 9px;
}
.dropdown-menu a{
    line-height: 32px !important;
}
.dropdown-toggle, .dropdown-toggle a:hover{
background-color: #1A1A1A !important;
}
.dropdown-menu{
    background: #1A1A1A !important;

}
.dropdown-menu>li>a {
    color: #2E699B !important;
}
.features p {
    color: #02A7D6;
    text-align: center;
    font-size: 20px;
    margin-top: 20px;
}
.nav .open>a, .nav .open>a:focus, .nav .open>a:hover,.nav .open>a:active,.nav .open>a:visited{
background-color: #1A1A1A !important;
}
.features{

}
.exa{
margin-bottom:60px;
}
.drop{
margin-top:20px;
}
.dropdown-toggle svg{
margin-top: -8px;
float: left;
 margin-right: 9px;
}
.dropdown-toggle a{
    line-height: 32px !important;
}
.simple{
    background: #1A1A1A;
    border-radius: 10px;
	padding:0px !important;
}
#customise{

background:#1a1a1a;
}
#customise input, #customise select{
    background: #2b2b2b;
    max-width: 215px;
    display: block;
    color: #dfdfdf;
    border-radius: 2px;
    font-weight: 700;
    margin-top: 3px;
	border-color:transparent;
}
#codecopy{
width:100%;
	background: #2b2b2b;
    display: block;
    color: #dfdfdf;
    border-radius: 2px;
    margin-top: 3px;
	border-color:transparent;
}
#customise label{
    padding-top: 5px;
    display: block;
    color: #00B5E8;
}
#customise input[type="number"]{
    width: 100px;
    display: inline-block;
    margin-right: 15px;
}
#box{
float:left;
width:20px;
height:20px;
background:#00B5E8;
}
.holder-div{
margin-bottom:30px;
margin-top:30px;
}
#customise button {
    background: #00B5E8;
    border: none;
    margin-top: 10px;
    padding: 5px;
    font-size: 11px;
    color: black;
    font-weight: 800;
    border-radius: 4px;
}
.holder-kod{
margin-top:10px;
}
.dummbell{
display:block;
margin:auto;
}
svg{
display:block;
margin:auto;
}
#piccol{
padding-top: 1px !important;
    display: inline-block !important;
    padding: 1px;
    margin: 0;
    border: solid 1px;
    position: relative;
    top: 7px;
}
#colorpickerField1{
    display: inline-block !important;
}
#nesto {

}
#logo-holder{
	width: 297px;
	height: 94px;
	margin:auto;
	    display: table;
		padding-top:20px;
}
#divider{
height:50px;
width:100%;
}
header{

background: #003077; /* Old browsers */
background: -moz-linear-gradient(left,  #003077 1%, #1a1a1a 23%, #1a1a1a 77%, #003077 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  #003077 1%,#1a1a1a 23%,#1a1a1a 77%,#003077 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  #003077 1%,#1a1a1a 23%,#1a1a1a 77%,#003077 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#003077', endColorstr='#003077',GradientType=1 ); /* IE6-9 */

}
#logo-holder img:nth-child(2) {
  opacity: 0;
  animation-name: show;
  animation-delay: 3s;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  animation-iteration-count: 1;
  animation-timing-function: linear;
}

.flip-vertical:hover .svg-icon{
	animation: flip-vertical linear 2s; 
	-webkit-animation: flip-vertical  linear 2s;
}
svg[effect="flip-vertical-auto"]{
	animation: flip-vertical infinite linear 2s; 
	-webkit-animation: flip-vertical infinite linear 2s;
}
svg[effect="flip-vertical-hover"]:hover{
	animation: flip-vertical linear 2s; 
	-webkit-animation: flip-vertical  linear 2s;
}
svg[effect="flip-horisontal-auto"]{
	animation: flip-horisontal infinite linear 2s; 
	-webkit-animation: flip-horisontal infinite linear 2s;
}
svg[effect="flip-horisontal-hover"]:hover{
	animation: flip-horisontal linear 2s; 
	-webkit-animation: flip-horisontal  linear 2s;
}
svg[effect="rotate-auto"]{
	animation: spin infinite linear 4s; 
	-webkit-animation: spin infinite linear 4s;
}
svg[effect="bounce-auto"]{
	animation: bounce infinite linear 1s; 
	-webkit-animation: bounce infinite linear 1s;
}
svg[effect="bounce-hover"]:hover{
	animation: bounce infinite linear 1s; 
	-webkit-animation: bounce infinite linear 1s;
}
svg[effect="rotate-hover"]:hover{
	animation: spin infinite linear 4s; 
	-webkit-animation: spin infinite linear 4s;
}
@keyframes spin {
 0% {
 transform:rotate(0deg);
 -webkit-transform:rotate(0deg);

 }

 100% {
 transform:rotate(360deg);
 -webkit-transform:rotate(360deg);

 }
}
@-webkit-keyframes spin {
 0% {
 transform:rotate(0deg);
 -webkit-transform:rotate(0deg);

 }
 100% {
 transform:rotate(360deg);
 -webkit-transform:rotate(360deg);

 }
}
@keyframes bounce {
 0% {
-ms-transform: scale(1,1); /* IE 9 */
    -webkit-transform: scale(1,1); /* Safari */
    transform: scale(1,1);

 }

 50% {
-ms-transform: scale(0.8,0.8); /* IE 9 */
    -webkit-transform: scale(0.8,0.8); /* Safari */
    transform: scale(0.8,0.8);

 }
  100% {
-ms-transform: scale(1,1); /* IE 9 */
    -webkit-transform: scale(1,1); /* Safari */
    transform: scale(1,1);

 }
}
@-webkit-keyframes bounce {
 0% {
-ms-transform: scale(1,1); /* IE 9 */
    -webkit-transform: scale(1,1); /* Safari */
    transform: scale(1,1);

 }

 50% {
-ms-transform: scale(0.8,0.8); /* IE 9 */
    -webkit-transform: scale(0.8,0.8); /* Safari */
    transform: scale(0.8,0.8);

 }
  100% {
-ms-transform: scale(1,1); /* IE 9 */
    -webkit-transform: scale(1,1); /* Safari */
    transform: scale(1,1);

 }
}

@-webkit-keyframes flip-horisontal{
  0% {
    -webkit-transform:  rotate3d(1, 0, 0, 0deg);
            transform:  rotate3d(1, 0, 0, 0deg);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }


  100% {
    -webkit-transform:   rotate3d(1, 0, 0, -360deg);
            transform:   rotate3d(1, 0, 0, -360deg);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }

}

@keyframes flip-horisontal {
  0% {
    -webkit-transform:  rotate3d(1, 0, 0, 0deg);
            transform:  rotate3d(1, 0, 0, 0deg);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }


  100% {
    -webkit-transform:  rotate3d(1, 0, 0, -360deg);
            transform:   rotate3d(1, 0, 0, -360deg);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
}

@-webkit-keyframes flip-vertical{
  0% {
    -webkit-transform:  rotate3d(0, 1, 0, 0deg);
            transform:  rotate3d(0, 1, 0, 0deg);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }


  100% {
    -webkit-transform:   rotate3d(0, 1, 0, -360deg);
            transform:   rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }

}

@keyframes flip-vertical {
  0% {
    -webkit-transform:  rotate3d(0, 1, 0, 0deg);
            transform:  rotate3d(0, 1, 0, 0deg);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }


  100% {
    -webkit-transform:  rotate3d(0, 1, 0, -360deg);
            transform:   rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
}




  svg[draw="infinite"] path, svg[draw="infinite"] circle, svg[draw="infinite"] polygon,svg[draw="infinite"] polyline, svg[draw="infinite"] line, svg[draw="infinite"] rect, svg[draw="infinite"] ellipse {
  fill-opacity: 0;
  stroke-dasharray: 1000;
  stroke-dashoffset: 0;
  animation-name: draw;
    animation-duration: 15s;
    animation-iteration-count: infinite;
}
  svg[draw="single"] path, svg[draw="single"] circle, svg[draw="single"] polygon,svg[draw="single"] polyline, svg[draw="single"] line, svg[draw="single"] rect, svg[draw="single"] ellipse {
  fill-opacity: 0;
  stroke-dasharray: 1000;
  stroke-dashoffset: 0;
  animation-name: draw;
    animation-duration: 15s;
    animation-iteration-count: 1;
}

@keyframes draw {
  0%   {stroke-dashoffset: 1000;}
    100% {stroke-dashoffset: 0;}
}

@keyframes show {
  to {
    opacity: 1;
  }
}
