﻿/*************************/
/* Main styles and sizes */
/*************************/
body{
    font-family:'PT Sans',Arial;
    text-align:left;
    background-size:1024px 665px;
    background-image:url("/images/wall.jpg");  
    background-position: center top;
}

#topheader{
	  zoom: 1 ;
  *display: inline;
  display: -moz-inline-stack;
  display:inline-block;
}
a.comments{
	border-width: 0;
}
a.comments .views_title{
	border-width: 0 0 1px 0;
            border-bottom-style: solid;
	border-bottom-color: rgba(0, 96, 192, 0.27);
}
a.comments:hover .views_title{
	border-bottom-color: rgba(255, 143, 0, 0.27);
}
img{border:0 !important}
!a img {border:0 !important}
a:visited{
  color: #6040a0;
  border-bottom-color: rgba(96, 64, 160, 0.27);
}
a:hover, a.hovered, .active a:hover,.navbar a:visited:hover,button.fast_link:hover{
  color: #ff8f00;
  border-bottom-color: rgba(255, 143, 0, 0.27);
}
.navbar-item a,.navbar a:visited,button.fast_link{
  text-decoration: none;
  line-height: normal;
  border-bottom-style: solid;
  outline: none;
  color: #0060c0;
  cursor:hand;
  border-bottom-color: rgba(0, 96, 192, 0.27);
  border-width: 0 0 1px 0 !important;
}
a:empty, a.comments{
  text-decoration: none;
  line-height: normal;
  border-bottom-style: solid;
  outline: none;
  color: #0060c0;
  cursor:hand;
  border-bottom-color: rgba(0, 96, 192, 0.27);
  border-width: 0;
}

a.navbar-item{
  text-decoration: underline; 
  border-width: 0;
}


.floats li a,.toogles_links li a, a.dashed{
    border-bottom-style: dashed;
    cursor: pointer;
}
.toogles_links li a{
    border-bottom-width: 1px;
}

.video button{
  vertical-align: middle;
  border: none;
  background: none;
  padding: 0;
  cursor: pointer ;
  margin-top: 5px;
}
.with_bg{
  background-color: rgba(255, 255, 255, 0.59);
}
.ul{
  margin: 0px;
}
.play_btn{
  margin: 0px;
  width:80px;
  height:80px;
  position: absolute;
  top: 140px;
  left: 280px;
  background-image: url('../images/play.png');
  background-repeat: no-repeat;
  background-position: left;
  background-size: 160px 80px;
}

.video button{
  position: relative;
}
@-webkit-keyframes rotating /* Safari and Chrome */ {
  from {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes rotating {
  from {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
.rotating {
  display: inline-block;
  -webkit-animation: rotating 2s linear infinite;
  -moz-animation: rotating 2s linear infinite;
  -ms-animation: rotating 2s linear infinite;
  -o-animation: rotating 2s linear infinite;
  animation: rotating 2s linear infinite;
}
@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }
.main-content {
text-align:left;
zoom: 1;
display: -moz-inline-stack;
display: inline-block;
position: relative;
clear: left;
width: 80%;
margin: 12px 0 0 0;
max-width: 1010px;
min-height: 320px;
}
#topheader{
  width:100%;
  height:70px;
  zoom: 1 ;
    *display: inline;
    display: -moz-inline-stack;
    display:inline-block;
}
 .sign{
  margin: 20pt 10pt 0pt 10pt;
  text-align: right;
}
.navbar{
}
.navbar-item{
	
}

.navbar-item.active{
 font-weight:bold;
}
.navbar-item .right{
}
.g-ytsubscribe{
  width:auto !important;
  height:auto !important;
}
#topheader.tn{
     height:280px;
}
#tn_top div{
  margin: 0 auto;
  position: relative;
 }
 #tn_logo{
 /* background-image: url('/images/tn.png');
  background-color: red;
  */
  z-index:4;
}
#tn_top{
  text-align: center;
  position: relative;
  z-index: 1;
 }

div{
  text-align: left;
  }
ul.cler{
  margin: 0;
  padding: 0;
  list-style: none;
}


.fill{
  width:100%;
  margin: 0px auto;
}

.nounderline{
  border-bottom-width: 0px;
}


.content{
  zoom: 1 ;
  *display: inline;
  display: -moz-inline-stack;
  display:inline-block;
  position: relative;
  clear: left;
}

.horiz_list{
 vertical-align:top;
 list-style: none;
 overflow:hidden;
}
.horiz_list li{
  vertical-align:top;
  float: left;
}
ul.list{
  list-style: none;
}
li.list:before {
  content:"— ";
}
.blck{
  position: relative;
  clear:both;
  overflow:hidden;
}
.rect {
  position: absolute;
}

.left{
    text-align:left;
    float: left; 
}
.central{
  text-align: center;
}
.blck{
  text-align: left;
}
h1, h2{
margin:0;
}
h1.large,h2.large{
   text-align:center;
}
.divcenter{
  margin-left: auto;
  margin-right: auto;
}
.center{
   text-align:center;
}

.div_center{
  margin-left:auto;
  margin-right:auto;
  display: block;
}
.download{
  display: inline-block;
}

.lft{
  text-align:left;
}
.screenshots{
  overflow:hidden;
}
.screenshot{
 vertical-align:bottom;
 height:289px;
 position:relative;
 display:block;
 text-align:center;
}
.screenshot img{
  vertical-align:bottom;
  position:absolute;
  bottom:0px;
  left:0%;
}
.screen_text{
}
.screen_with_text{
   display: block;
  float:left;
  max-width:45%;
  padding:10px;
}
/*
.button {
   border: 1px solid #3b4592;
    background: -webkit-gradient(linear, left top, left bottom, from(#18fd600), to(#1c7f00));
    background: -webkit-linear-gradient(#18fd600, #1c7f00);
    background: -moz-linear-gradient(top, #18fd600, #1c7f00);
    background: -ms-linear-gradient(#18fd600, #1c7f00);
    background: -o-linear-gradient(#18fd600, #1c7f00);
    background: linear-gradient(#18fd600, #1c7f00);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#FF0000FF, endColorstr=#FFFFFFFF);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#FF0000FF, endColorstr=#FFFFFFFF)";
    zoom: 1;
   padding: 0px 61px;
   -webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   border-radius: 8px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.8) 0 -1px 0;
   color: #ffffff;
   font-size: 50px;
   font-weight:bold;
   text-decoration: none;
   vertical-align: middle;
   }
.button:hover {
       background: -webkit-gradient(linear, left top, left bottom, from(#00b14d), to(#003c03));
   background: -webkit-linear-gradient(top, #00b14d, #003c03);
   background: -moz-linear-gradient(top, #00b14d, #003c03);
   background: -ms-linear-gradient(top, #00b14d, #003c03);
   background: -o-linear-gradient(top, #00b14d, #003c03);
   }
.button:active {
   border-top-color: #507791;
   background: #507791;
   }
   */
   /* button 
---------------------------------------------- */
.button {
  display: inline-block;
   font-weight:bold;
   text-decoration: none;
   vertical-align: middle;
  outline: none;
  cursor: pointer;
 
}
.button:hover {
  text-decoration: none;
}
.button:active {
  position: relative;
}
/* color styles 
---------------------------------------------- */
/* green */

.large_name.container
{ overflow: hidden; }

.frontpage-gallery-element{
  float:left;
}

.blog_title{
  background-color: #feeac1;
  /*background-image: url("https://dl.dropboxusercontent.com/u/300067/Site/shirts.jpg");*/
  background-repeat: repeat-x;
  text-align: center;
  clear:left;
  overflow: hidden;
}

.blog_title{
  vertical-align: center;

  line-height: normal;
  font-weight: bold;
  text-align: center;
  background-image: url("/images/blog bg.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-clip: 
 
}
span{
  margin: 0;
  padding: 0;
}

.shelf{
  overflow: hidden;
}
.level1{
 text-align: center;

}
.level2{
}
.book{
  float:left;
  display: block;

  vertical-align: top;

}

div.book div img{
vertical-align:bottom;

}

div.book div{

  text-align: center;

}



#links{
  vertical-align: top;
}
#links div{
  float:left;
  
}
#links div ul li{
  white-space: nowrap;
  overflow: hidden;
  
}
#links div ul li {
    display: inline-block;
    position: relative;
}

#links div ul li img {
   vertical-align: middle;
   margin-right: 3px;
}
#links div ul li::after {
    position: absolute;
    top: 2px;
    bottom: 0;
    right: 0;
    width: 3em;
    content: '';
    background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* IE10+ */
    background: linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 */
}
#links div ul {

  overflow: hidden;
  margin: 0px;
  padding: 0px;
  line-height: 2em;
}

.shelf, .blog_title{
  margin-bottom: 50px;
}
.video_list{
  text-align: center;
  width: 100%;
}

.tn_date{
  position: absolute;
  white-space: nowrap;
  text-align: right;
  right: 100%;
  margin-right: 10px;
}
a.no_underline{
	border-bottom: 0;
}

.left_bottom{
position: absolute;
white-space: nowrap;
text-align: right;
right: 100%;
top: 100%;
margin-right: 10px;
margin-top: -1.5em;
}
.views{
  position: relative;
  top: 0.4em;
}
.views_title{
  font-size: 8pt;
}
.video{
  position: relative;
}

button.fast_link{
  text-decoration:none;
  background: none;
  padding: 0;
  cursor: pointer ;
  margin: 0px;
  font-size: 11pt;
  /*border-bottom: 1px dashed;
  border: none;
  background: none;
  
  border-bottom-color: #999;
  display: inline;
  text-decoration:none;*/
}
.right-absolute{
  position: absolute;
}

.floats li{
  display: inline;
}

.floats{
  list-style: none;
  padding: 0;
  text-align:center;
}


code{
  white-space: nowrap;
}

/*************************/
/* 		 Sizes			 */
/*************************/
* {
  line-height: 1.35em;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
a.large{
   border-bottom-width: 2px;
   height:1.15em;
   zoom: 1 ;
  *display: inline;
  display: -moz-inline-stack;
  display:inline-block;
}
a.extralarge{
   border-bottom-width: 3px;
   height:1.2em;
     zoom: 1 ;
  *display: inline;
  display: -moz-inline-stack;
  display:inline-block;
}
p a, ul a, ol a {
padding-top: 0em;
}
a img{
	display: inline-block;
	/*margin:auto auto;*/
}
a.img{
	border:0;
}
.content{
 
 width: 80%;
 padding: 0px 50px;
 }
 .content.travel{
  max-width: 1100px;
  width: 90%;
  padding: 0px 0px;
 }


.navbar{
	white-space:nowrap;
	overflow:hidden;
	margin:5px 37px;
	height:1.1em;
	font-size:14pt;
}
.navbar-item{
	margin-right:14pt;
	
	float:left;
}
.navbar-item.active{
}
.navbar-item.right{
    float:right;
	margin-right:0px;
	margin-left:15pt;
	padding:0px;
	border-width:0px 0px 1px 0px;
	
}

#tn_top div img{
	margin-bottom: 0px;
}

#tn_top div{
  width: 613px;
  height: 229px;
 }
 #tn_top{
  width: 100%;
  height: 350px;
  overflow:hidden;
 }
 #subscribe {
  left: 680px;
    top: -20;
    background-image: url('../images/subscribe.png');
    width: 424px !important;
    height: 100px !important;
    z-index: -1;
    overflow: hidden;
    background-repeat: no-repeat;
 }
 #tn_top div .ytsubscribe{
  position:absolute;
  bottom: 0;
  left: 100%;
  width: 206px;
  height: 50px;
}
p {
  margin:10pt 0px 0px 0px;
  padding: 0px;
}
div{
  margin:0;
}
table, tr,td{
  margin:0px;
  padding:0px;
  border-collapse: collapse;
  border-spacing: 0px;
  vertical-align: top;
}

.horiz_list li a{
    margin-right: 20pt;
}

.fill{
  width:100%;
  margin: 0px auto;
}
div.large_caption{
  margin:0px 50px;
}
.cat_button {
  cursor: pointer;
}
table{
  width:100%;
}

.horiz_list{
 height:30pt;
 line-height:26pt;
 padding:0px;
 margin:0px;
 margin-left:37px;
}
.wide{
  width: 100%;
  padding: 0px;
  max-width:none;
}
.with_right{
  width: 80%;
  margin-right:  190px;
  padding: 0px;
}
.horiz_list li{
  padding: 0px;
}
ul.list{
  margin: 0px;
  padding: 0px; 
}
.blck{
  width:100%;
  margin-top:20px;
}
.rect {
  line-height:26pt;
  height: 100%;
  width:17px;
}


.extralarge{
	font-size:56pt;
	font-weight: bold;
}
.large{
  font-size:40pt;
  }
.mono, .code{
	font-family:'PT Mono',Arial;
}
.download{
  margin:15pt 0pt;
}

.button {
  margin-top:10px;
   font-size: 15pt;
   font-weight:bold;
   padding: 0px 61px;
   border-radius: 8px;
  -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.8) 0 -1px 0;
  -moz-border-radius: 8px; /* Firefox */
  -webkit-border-radius: 8px; /* Safari, Chrome */
  -khtml-border-radius: 8px; /* KHTML */
  border-radius: 8px; /* CSS3 */
}
.button.small{
  font-size: 20pt;
  padding: 0px 30px;
}
.button:active {
  top: 1px;
}
.blog_title{
  height:300px;
 font-size:30pt;
 max-width:1110px;

  height: 170px;
   -moz-border-radius: 8px;
  -webkit-border-radius: 8px; 
  -khtml-border-radius: 8px; 
  border-radius: 8px; 
}
.shelf{
  width: 100%;
  overflow: hidden;
 
    zoom: 1 ;
  *display: inline;
  display: -moz-inline-stack;
  display:inline-block;
}
.book{
  margin-left: 16px;
  margin-top: 8px;
  margin-bottom: 2px;
  padding: 0px;
}
.large .book{
  margin-left: 50px;
}

.level0, .level1,.level2,.level3{
	

	zoom: 1 ;
	*display: inline;
	display: -moz-inline-stack;
	display:inline-block;
	text-align:center;
}
.shelf.level0, .shelf.level1,.shelf.level2,.shelf.level3{
  margin-bottom: 50px;
}
div.level0 .book{
  margin-left:100px;
}
div.level2 .book{
  width: 360px;
  font-size: 20pt;
  margin-left:100px;
}
.book.first{
  margin-left:0px !important;
}

div.level3 .book{
  width: 230px;
  font-size: 12pt;
}

div.level2 div.book div{
  height: 255px;
}
div.level3 div.book div{
  height: 130px;
}
div.book p{
  margin: 0px;
 
}

#seperator{
  margin-top: -98px;
  width: 100%;
  height: 98px;
}
#links{
  width: 100%;
  height: 98px;
}
#links div{
  width: 16%;
  margin-right: 4%;
}
#links div ul{
  margin-top: 10px;
}

#links div.lst{
  width: 40%;
  margin-right: 0%;
  
}
#links div ul li {
    width:100%;
	height:1.8em;
	line-height:1.8em;
}
.video{
 
  margin: 0px auto 70px auto;
  width: 640px;

}
.video button, .video iframe{
margin-top:5px;
}
.right-absolute{
  left:100%;
  margin-left: 15px;
}
.floats li{
  margin-right: 2em;
}
code{
    margin: 0 2px;
	padding: 0px 5px;
	border: 1px solid;
	border-radius: 3px;

}

/*************************/
/*		 Colors			 */
/*************************/
a {
  color: #0060c0;
  border-bottom-color: rgba(0, 96, 192, 0.27);
}
.color_gray{
	color: #406080;
}
a.color_gray{
   border-bottom-color: rgba(189, 200, 208, 0.5);
}

div.red{
	 background-color: red;
}
div.blue{
	background-color:blue;
}
.color_blue{
  color:#0060c0;
}
.black{
  color:black;
}


.button.color_green {
  color: #ffffff;
  border: solid 1px #538312;
  background: #64991e;
  background: -webkit-gradient(linear, left top, left bottom, from(#7db72f), to(#4e7d0e));
  background: -moz-linear-gradient(top,  #7db72f,  #4e7d0e);
  filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#7db72f', endColorstr='#4e7d0e');
}
.button.color_green:hover {
  background: #538018;
  background: -webkit-gradient(linear, left top, left bottom, from(#6b9d28), to(#436b0c));
  background: -moz-linear-gradient(top,  #6b9d28,  #436b0c);
  filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#6b9d28', endColorstr='#436b0c');
}
.button.color_green:active {
  color: #f6f9f3;
  background: -webkit-gradient(linear, left top, left bottom, from(#4e7d0e), to(#7db72f));
  background: -moz-linear-gradient(top,  #4e7d0e,  #7db72f);
  filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#4e7d0e', endColorstr='#7db72f');
}

.button.color_blue {
  color: #ffffff;
  border: solid 1px #005a95;
  background: #008ae6;
  background: -webkit-gradient(linear, left top, left bottom, from(#008ae6), to(#005a95));
  background: -moz-linear-gradient(top,  #008ae6,  #005a95);
  filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#008ae6', endColorstr='#005a95');
}
.button.color_blue:hover {
  background: #0077c5;
  background: -webkit-gradient(linear, left top, left bottom, from(#0077c5), to(#004977));
  background: -moz-linear-gradient(top,  #0077c5,  #004977);
  filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#0077c5i', endColorstr='#004977');
}
.button.color_blue:active {
  color: #eef6fe;
  background: -webkit-gradient(linear, left top, left bottom, from(#00548b), to(#008ae6));
  background: -moz-linear-gradient(top,  #00548b,  #008ae6);
  filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#00548b', endColorstr='#008ae6');
}

div.text{
  margin-bottom: 1em;
  margin-top: 2em;
}
code{
	border-color: #ddd;
	background-color: #f8f8f8;

}
.article
{
  position: relative;
  width: 500px;
  padding: 50px;
  margin: 0 auto;
  background-color: #fff;
  -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
}
.article:before, .article:after
{
  position: absolute;
  width: 40%;
  height: 10px;
  content: ' ';
  left: 12px;
  bottom: 12px;
  background: transparent;
  -webkit-transform: skew(-5deg) rotate(-5deg);
  -moz-transform: skew(-5deg) rotate(-5deg);
  -ms-transform: skew(-5deg) rotate(-5deg);
  -o-transform: skew(-5deg) rotate(-5deg);
  transform: skew(-5deg) rotate(-5deg);
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
  z-index: -1;
} 

.article:after
{
  left: auto;
  right: 12px;
  -webkit-transform: skew(5deg) rotate(5deg);
  -moz-transform: skew(5deg) rotate(5deg);
  -ms-transform: skew(5deg) rotate(5deg);
  -o-transform: skew(5deg) rotate(5deg);
  transform: skew(5deg) rotate(5deg);
}