@import url('https://fonts.googleapis.com/css?family=Poppins:400,700');
@import url('https://fonts.googleapis.com/css?family=Roboto:400,700,900');
@import url('https://fonts.googleapis.com/css?family=Oswald:400,700,900');
body{ margin:0; padding:0; font-family:'Roboto'; font-size:13px; padding-top:40px }
a:focus { outline:0 }
h1,h2,h3,h4,h5,h6{
	margin:15px 0;
	padding:0;
	position:relative;
	font-weight:normal;
	padding-bottom: 20px;
	font-family: 'Roboto'
}

h1 {
	font-size:42px;
	padding-left:50px;
	font-weight:900;
	color:#042433;
	margin-left:-20px
}
h2 {
	font-size:34px;
	padding-left:35px
}
h3 {
	font-size:26px;
	padding-left:32px
}
h4 {
	font-size:20px;
	padding-left:26px
}
h5 {
	font-size:18px 
}
h6 {
	font-size:16px 
}
h1::before{
    content: "\e656";
    position: absolute;
    font-family: 'Pe-icon-7-stroke';
	color:rgba(255,216,0,1);
	left: -9px;
    top: -5px;
    font-size: 52px;
}
h1.download::before{
    content: "\e65c";
	left:-7px;
}
h1.installation::before{
    content: "\e617";
	left:-7px;
}
h1.woocommerce::before{
   content: "\e66e";
	left:-7px;
}
h1.header::before{
    content:"\e626";
	left:-7px;
}
h1.pages::before{
    content:"\e672";
	left:-7px;
}
h1.footer::before{
    content:"\e645";
	left:-7px;
}
h1.widgets::before{
    content:"\e65d";
	left:-7px;
}
h1.theme-options::before{
    content:"\e659";
	left:-7px;
}
h1.contact::before{
    content: "\e639";
	left:-7px;
}
h1.rev::before{
    content:"\e67d";
	left:-7px;
}
h1.translation::before{
    content:"\e64f";
	left:-7px;
}
h2::before{
    content: "\e656";
    position: absolute;
    font-family: 'Pe-icon-7-stroke';
	color:rgba(255,216,0,1);
	left: -8px;
    top: 2px;
    font-size: 42px;
}
h3::before{
    content: "\e665";
    position: absolute;
    font-family: 'Pe-icon-7-stroke';
	color:rgba(255,216,0,1);
	left: -4px;
    top: 2px;
    font-size: 32px;
}

h4::before{
    content: "\e636";
    position: absolute;
    font-family: 'Pe-icon-7-stroke';
	color:rgba(255,216,0,1);
	left: -2px;
    top: 2px;
    font-size: 24px;
}



h1::after{
    content: "";
    display: block;
    width: 150px;
    height: 2px;
    position: absolute;
    left: 0;
    top: 60px;
    background: rgba(255,216,0,1);
}
h2::after{
    content: "";
    display: block;
    width: 150px;
    height: 2px;
    position: absolute;
    left: 0;
    top: 50px;
    background: rgba(255,216,0,.7);
}
h3::after{
    content: "";
    display: block;
    width: 150px;
    height: 2px;
    position: absolute;
    left: 0;
    top: 40px;
    background: rgba(255,216,0,.5);
}
h4::after{
    content: "";
    display: block;
    width: 150px;
    height: 2px;
    position: absolute;
    left: 0;
    top: 35px;
    background: rgba(255,216,0,.3);
}
nav {
	display: table;
	position: fixed;
	width: 300px;
	top:0;
	background:#000;
	z-index:1000;
	height:100%
}


nav ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: table;
  margin: auto;
  background:#000
}

nav ul ul {
  opacity: 0;
  position: absolute;
  top: 160%;
  visibility: hidden;
  transition: all .2s ease;
  -webkit-transition: all .2s ease;
}

nav ul ul ul {
  top: 0%;
  left: 160%;
}

nav ul ul li:hover > ul {
  top: 0%;
  left: 100%;
  opacity: 1;
  visibility: visible;
}

nav ul li:hover > ul {
  opacity: 1;
  top: 100%;
  visibility: visible;
}

nav ul li {
  float: left;
  position: relative;
}

nav ul ul li { float: none; }

nav ul li {
  clear:both;
  cursor: pointer;
}
nav ul li ul{
  margin-left:200px;
  margin-top:-50px;
}
nav ul li ul li ul{
  
  margin-left:0
}

nav ul a {
  text-decoration: none;
  display: block;
  color: #FFF;
  width:auto;
  padding: 10px 15px;
  text-align: center;
  text-shadow: 0px -1px 0px rgba(0,0,0,.2);
  font-size:18px;
  text-align:left
}

nav i { font-size:24px; position:relative; top:4px; margin-right:4px; color:#ffeb00 }
nav a:hover i { color:#000 }
nav span.has-submenu { margin-left:5px; color:#4dc367; font-weight:bold}
nav span.number {  background:#000; color:#c1c1c1; padding:4px; font-size:12px; font-weight:900; margin-right:5px; border-radius:2px }

nav ul.main { margin-top:50px}

nav ul.header { margin-left:135px; margin-top:-150px}
nav ul.header a{ min-width:150px }

nav ul.install { margin-left:175px; margin-top:-100px}
nav ul.install a{ min-width:150px }

nav ul.blog { margin-left:120px; margin-top:-60px}
nav ul.blog a{ min-width:120px }

nav ul.theme-options { margin-left:195px; margin-top:-300px}
nav ul.theme-options a{ min-width:200px}

nav ul.woocommerce { margin-left:145px; margin-top:-100px}
nav ul.woocommerce a{ min-width:240px }

nav ul.pages { margin-top:-180px; margin-left:280px; width:300px;}
nav ul.pages a{ min-width:280px }
nav ul.pages li a {  }


nav ul.portfolio a{ min-width:200px }
nav ul.portfolio-inside { margin-top:-100px }
nav ul.portfolio-inside a{ min-width:140px }



nav ul.blog a{ min-width:180px }
nav ul.blog-inside { margin-top:-180px; }
nav ul.blog-inside a{ min-width:160px }

nav ul.woo-inside { margin-top:-150px }
nav ul.woo a{ min-width:250px }
nav ul.woo-inside a{ min-width:170px }



nav ul.vc { margin-top:-75px; min-width:460px;}
nav ul.vc li { display:inline-block }
nav ul.vc a { min-width:200px }

nav > ul > li{
	width:100%;
}

/* level 1 */
nav ul li > ul{
	background:#101010 !important;
	padding:20px;
	z-index:10000;
	margin-left:269px !important
}

/* level 2 */
nav ul li ul li > ul{
	background:#232323 !important;
	padding:20px;
	margin-left:0 !important
}


/* level 3 */
nav ul li ul li ul li > ul{
	background:#232323 !important;
	padding:20px;
	margin-left:0 !important
}

/* level 2 */
nav ul li ul li > ul a{
	font-size:13px
}


nav ul li > ul a{
	font-size:14px
}

nav ul li ul li > ul{

}



nav ul li:hover > a { background:#ffeb00; color: #000; text-shadow:none }
nav ul li:hover > a i { color:#000 }

nav ul li a:hover {     background: #ffeb00; color: #000; text-shadow:none }

nav ul li ul li a { text-align:left; }

.logo img { margin:50px 0 0 24px }


.container { width:calc(100% - 420px); padding-left:370px }

.container p { line-height:2em; font-size:15px }
.container p.note { color: #888888; font-size: 12px;    background: #f5f5f5;
    padding: 10px 15px; 
}
.container p.note.important {    
	background: #fff3af;
    color: #927c00;
}

.container a{ background:rgba(255,216,0,1); color:#000;text-decoration:none; font-weight:bold;  padding:5px 10px; display: inline-block }
.container a.external{ background:#0bbaff; color:#fff }
.container a:hover{ text-decoration:underline; }

.container li { position:relative; padding-bottom:12px; line-height: 1.7em }
.container li:after {    
    content: "";
    width: 100px;
    height: 1px;
    position: absolute;
    left: -20px;
    background: #e0e0e0; 
	bottom:5px;
}
.container ul li { list-style-type:disc }
ul.inside, ol.inside { margin-top:10px }
ul.inside li:last-child:after { content:none }
.no { list-style-type:none !important; border-bottom:solid 2px #eee;}
.no-border {  border:none}
.no:after { content:none !important  }
.no-note { list-style-type:none !important }
.no-note:after { content:none !important  }
.fsize15px{ font-size:15px; }

.fig2{
	margin-top:160px
}
.fig3{
	margin-top:110px
}


.container img { -webkit-box-shadow: 1px 2px 23px 3px rgba(0,0,0,0.13);
-moz-box-shadow: 1px 2px 23px 3px rgba(0,0,0,0.13);
box-shadow: 1px 2px 23px 3px rgba(0,0,0,0.13); padding:10px;clear:both; max-width:100%; box-sizing:border-box}
.col-holder { width:100%; display:table; clear:both }
.col-1 { width:60%; margin-right:20px; padding-right:20px; float:left; border-right:solid 1px #eee; box-sizing: border-box; }
.col-2 { width:35%; float:left;  box-sizing: border-box; }
.col-2 img{ margin-bottom:20px }
.col-2 figcaption{ bottom: 33px; }
.col-half:nth-child(2n) { margin-right:0; padding-right:0; border:none;  }

pre {
    background: #ffffff;
    background: -moz-linear-gradient(top, #ffffff 50%, #f7f7f7 50%);
    background: -webkit-linear-gradient(top, #ffffff 50%,#f7f7f7 50%);
    background: -o-linear-gradient(top, #ffffff 50%,#f7f7f7 50%);
    background: linear-gradient(top, #ffffff 50%,#f7f7f7 50%);
    background-size: 42px 42px;
    padding: 21px 15px 20px;
    margin: 15px 0;
    display: block;
    white-space: pre-wrap;
    white-space: -moz-pre-wrap;
    white-space: -pre-wrap;
    white-space: -o-pre-wrap;
    line-height: 21px !important;
	display:block;
	clear:both;
	padding-bottom:0;
	border: 1px solid #ececec;
}
figcaption{
	font-weight:bold;
	font-size:15px;
	background:#ff4120;
	color:#FFF;
	display:inline-block;
	padding: 5px 10px;
	position:absolute;
	left:10px;
	bottom:13px
}
.container .fig{
	background:#38a550;
	color:#FFF;
	font-family: 'Oswald';
    text-transform: uppercase;
    letter-spacing: 2px;

}
a[rel="prettyPhoto"]{
	position:relative;
	clear:both;
	display:block;
	background:none;
	padding:0
}
.separator {
	width:100%;
	background:#042433;
	height:8px;
	margin:70px 0;
	margin-left: -25px;
    width: calc(100% + 25px);

}
.separator-mini {
	width:100%;
	background:#042433;
	height:4px;
	margin:50px 0 30px 0;
}
.separator-mini2 {
	width:100%;
	background:#074e6f;
	height:2px;
	margin:50px 0 30px 0;
}
.separator-mini3 {
	width:100%;
	background:#a3bbc6;
	height:1px;
	margin:50px 0 30px 0;
}
div[id^=div]{
	display:table;
	clear:both;
	width:100%
}

span.big{
	font-size:24px
}
span.heading{
    font-family: 'Oswald';
    font-size: 16px;
	text-decoration:underline;
}
.row-eq-height {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	flex-wrap: wrap
}
.go_back{position:fixed; top:100px; right:0; display:none; z-index:10}
.go_back a{padding:20px; color:white; background:#f22a7b; font-size: 24px}
.info-legend{ float:left; margin-right:15px; margin-bottom:15px}
.legend{ width:20px; height:20px; margin-right:7px; float:left }
.legend.internal { background:#ffd800 }
.legend.external { background:#0bbaff }
.legend.figure { background:#38a550 }
.level3{ padding-left:30px; box-sizing:border-box }
.level4{ padding-left:60px; box-sizing:border-box }
.ptop40{ padding-top:40px }
h1.main{    
	font-size: 32px;
    color: #fff;
    padding-top: 0;
    margin-top: 0;
    padding-left: 43px;
	margin-top:40px
}
h1.main:before{ content:none }
h1.main:after{ content:none }

@media (max-width: 999px) {
.col-1 { width:100%; margin-right:0; padding-right:0; float:none; border-right:none; }
.col-2 { width:100%; float:none;  box-sizing: border-box; }	
}

#locale {
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  border-collapse: collapse;
  max-width: 400px;
}

#locale td, #locale th {
  border: 1px solid #ddd;
  padding: 8px;
}

#locale tr:nth-child(even){background-color: #f2f2f2;}

#locale tr:hover {background-color: #ddd;}

#locale th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  background-color: #4CAF50;
  color: white;
}
#locale td:nth-of-type(2){
	display:none
}
#locale thead td{
	background:#000;
	color:#fff
}
.close{
	position:absolute!important;
	left:10px !important;
	top:-18px!important;
	padding: 5px !important;
    text-align: center!important;
    background: #0bbaff!important;
    width: 20px !important;
    height: 20px !important;
	font-weight:300 !important;
	border-radius:3px;
	font-size:15px !important
}