﻿/*
[Contents]

  0- Global
  1- Header
  2- Footer
  3- Block
  4- Main Block(Videos Documents)
  5- Service Intro(Home)
  6- Demo
*/

/* =0 Global
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––---------------------------------––*/
/*======== Links ========*/
a.common_link{
  background:url(images/sprite.png) no-repeat left -635px;
  display:inline-block;
  margin-right:20px;
  padding-left:10px;
}

a.button_link{
  background:url(images/sprite.png) no-repeat -460px -530px;
  color:#727272;
  display:inline-block;
  font-weight:bold;
  height:24px;
  line-height:24px;
  padding-left:15px;
}

a.button_link span{
  background:url(images/sprite.png) no-repeat right -530px;
  display:block;
  height:24px;
  line-height:24px;
  padding-right:15px;
}

a.button_link:hover{
  color:#69C;
}

/*======== Form ========*/
.label{
  float:left;
  line-height:22px;
  margin-right:10px;
}

.small_text_input{
  background:url(images/sprite.png) no-repeat -460px -554px;
  border:none;
  color:#4E4E4E;
  display:block;
  font-size:12px;
  height:18px;
  margin-bottom:6px;
  padding:3px;
  width:195px;
}

.button{
  background:none;
  border:none;
  color:#727272;
  cursor:pointer;
}

.button span{
  background:url(images/sprite.png) no-repeat -460px -530px;
  display:block;
  font-weight:bold;
  height:24px;
  padding-left:15px;
}

.button em{
  background:url(images/sprite.png) no-repeat right -530px;
  display:block;
  font-family:Arial;
  font-style:normal;
  height:24px;
  line-height:24px;
  padding-right:15px;
}

.button:hover{
  color:#69C;
}

/* =1 Header
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––---------------------------------––*/
#header{
  background-repeat:repeat-x;
}

#header .global_width{
  height:37px;
}

/*======== LOGO ========*/
.logo{
  float:left;
  margin-right:39px;
  margin-top:5px;
}

/*======== NAV ========*/
.nav{
  background-position:606px -476px;
  float:left;
  font-family:Arial;
}

.nav li{
  float:left;
}

.nav a{
  background:url(images/sprite.png) no-repeat left -476px;
  color:#333;
  display:inline-block;
  font-weight:bold;
  height:14px;
  padding:10px 16px;
}

.nav a:hover{
  color:#69C;
}

/*======== SEARCH ========*/
.search{
  background-position:left -512px;
  float:right;
  height:22px;
  margin-top:5px;
  position:relative;
  width:144px;
}

.search label{
  color:#C3C3C3;
  float:left;
  line-height:22px;
  padding-left:5px;
}

.search input{
  background:none;
  border:none;
  color:#C3C3C3;
  font-size:12px;
  left:0;
  margin-left:5px;
  padding-top:4px;
  position:absolute;
  top:0;
  width:120px;
}

.search button{
  background-position:-149px -512px;
  border:none;
  cursor:pointer;
  float:right;
  height:22px;
  width:22px;
}

/* =2 Footer
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––---------------------------------––*/
#footer{
  border-top:1px solid #999;
  color:#999;
  font-size:11px;
  padding:5px 0;
  padding-bottom:20px;
}

/*======== Copyright ========*/
.copyright{
  float:left;
}

/*======== Company Info ========*/
.company_info{
  float:right;
}

.company_info li{
  float:left;
}

.company_info a{
  border-right:1px solid #999;
  padding:0 10px;
}

.company_info a:hover{
  text-decoration:underline;
}

.company_info a.last{
  border:none;
  padding-right:0;
}

/* =3 Block
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––---------------------------------––*/
.block{
  margin-bottom:20px;
}

.block h3{
  background-position:left -534px;
  color:#FFF;
  font-size:14px;
  height:25px;
  line-height:25px;
  padding-left:19px;
}

.block ul{
  background-position:-230px bottom;
  padding:0 10px;
}

.block li{
  border-bottom:1px solid #CCC;
  padding:5px 10px;
}

.block li.last{
  border-bottom:none;
}

.block a{
  background:url(images/sprite.png) no-repeat left -634px;
  color:#333;
  display:block;
  font-size:14px;
  padding-left:20px;
}

.block a:hover{
  color:#69C;
}

/* =4 Main Block(Videos Documents)
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––---------------------------------––*/
.main_content{
  background:#FFF;
  border:1px solid #CCC;
  min-height:395px;
  padding:20px;
  padding-bottom:0;
  padding-top:46px;
  position:relative;
  
  /* Do rounding */
  border-radius:5px;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
}

.main_content h2.page_title{
  background-position:-460px -578px;
  color:#FFF;
  display:block;
  font-size:14px;
  height:25px;
  left:-1px;
  line-height:25px;
  padding-left:20px;
  position:absolute;
  right:-1px;
  top:-1px;
}

.main_content h2.page_title span{
  background-position:right -37px;
  display:block;
}

.main_content span.date{
  background:url(images/sprite.png) no-repeat -686px -492px;
  display:block;
  font-size:10px;
  line-height:13px;
  margin-bottom:10px;
  padding-left:14px;
  padding-top:1px;
}

.main_content a.download{
  margin-bottom:20px;
}

.main_content div.content{
  font-size:13px;
  line-height:20px;
}

.main_content div.content img{
  margin:10px 0;
}

.main_content div.content li{
  list-style-type:disc;
  margin-left:20px;
}

.main_block{
  border-bottom:1px solid #F0F0F0;
  padding:15px 0;
  position:relative;
}

.main_block h3{
  font-size:14px;
  margin-bottom:5px;
}

.main_block h3 a{
  color:#333;
  text-decoration:underline;
}

.main_block div.content{
  line-height:16px;
}

.main_block a.common_link{
  margin-top:15px;
}

.main_content div.last{
  border-bottom:none;
  padding-bottom:0;
}

/* =5 Service Intro(Home)
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
.service_intro{
  border:1px solid #CCC;
  margin-bottom:20px;
  padding:8px 20px;
  
  /* Do rounding */
  border-radius:5px;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;

}

.service_intro h3{
  margin-bottom:10px;
}

.service_intro p{
  font-size:12px;
  line-height:18px;
}

/* =6 Demo
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––---------------------------------––*/
.demo label{
  width:60px;
}
.demo button{
  margin-left:62px;
}
.demo h3{
  margin-bottom:20px;
}