@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,400italic,700,700italic);
@import url('normalize.css');
@import url('navigation.css');
@import url('columns.css');

body { margin:0; padding:0; width:100%; background-color: white; }
body p, ul, li, td, div  { font:normal 12px "Open Sans", Arial; color:#585555; }
html { padding:0; margin:0;  }

.clear { overflow: hidden; width: 100%; }

.wrapper { width:100%; padding: 0; margin: 0 auto; }
.main-container { width:100%; height: auto; padding: 0; margin: 0 auto; background:#f5f5f5 url("../images/mainbg.jpg") no-repeat; background-position:center; }
.main { max-width:1020px; padding:15px 0; margin:0 auto; }
.header { max-width:1020px; margin:0 auto;  padding: 0 5px; }
.Pictograms { width:100%;}

h1 { font-size: 32px; font-weight: 700;  padding:0; margin:0; }
h2 { font-size: 19px; font-weight: 700;  padding:2px 0; margin:0; }
h3 { font-size: 20px; font-weight: 700;  padding:0; margin:0; }
h3 span { font-size: 20px; font-weight: 400;  padding:0; margin:0; }


a { color: #0f7eca; }
a:hover { color: #b62a22; text-decoration: none; }

.line { border-top:1px solid #f4f4f4; clear: both; padding: 2px 0;	margin: 0px; }
.line_vert { border-left:1px solid #f4f4f4; padding: 2px 10px;	margin: 0px; }

a.none { text-decoration: none; }


.btn {clear: both;  padding: 10px 0; float: right; position: absolute; bottom: 0; right:0;}
.btn a { background-color: #8f8f83; padding:5px 30px; color:#fff; font-size: 14px; font-weight: 700; text-decoration:none; 	text-shadow: 1px 1px 0px #686860; }
.btn a:hover { background-color: #073351; color: #FFF; 	text-shadow: 1px 1px 0px #05263d;}

.btnR { clear: both; padding: 10px 0; float: right; position: absolute; bottom: 0; right:0;}
.btnR a { background-color: #bf2f26; padding:5px 30px; color:#fff; font-size: 14px; font-weight: 700; text-decoration:none; 	text-shadow: 1px 1px 0px #97251d; }
.btnR a:hover { background-color: #073351; color: #FFF;  	text-shadow: 1px 1px 0px #05263d;}


 /*  HEADER  ------------------------------------------------------------------------------------*/
.title { float: left; }
.logo { padding: 0px; float: left;}
.logo h1 { font-size: 72px; color:#073351; font-weight: 700; margin:0; padding: 0 15px 0 0;}
.tag { padding: 15px 0 0 15px; border-left:1px solid #f4f4f4; float: left; color:#073351; }
.tag  h1 {  font-size: 24px; color:#073351; margin:0; padding:0; }
.tag  h2 {  font-size: 17px; font-weight: 400; margin:0; padding:0; color:#585555;}
.tag  h2 span {  font-size: 11px; font-weight: 400; margin:0; padding:0; color:#585555; }

.online { padding: 5px 0px; float: left; }
.contact_info { padding: 5px 0px; float: right; }
.contact_info a { font-size: 14px; color:#585555; }
.contact_info .active {  font-weight: 700; text-decoration: none; }
.contact_info img {padding-left: 15px; float:right;}
.call { padding: 0px; float: right; font-size: 16px; color:#063351; padding-top: 25px; text-align:right; }





 /*  MAIN CONTENT  ------------------------------------------------------------------------------------*/

.content {
  display:block;
	position: relative;
	padding: 10px;
	background-color: #fff;
}
.content_noP {
	position: relative;
	padding: 0;
	background-color: #fff;
}
.shadow {

	/*
	background-color: rgb(68,68,68); 

	-moz-box-shadow: 1px 1px 3px 3px rgba(68,68,68,0.1);
	-webkit-box-shadow: 1px 1px 3px 3px rgba(68,68,68,0.1);
	box-shadow: 1px 1px 3px 3px rgba(68,68,68,0.1);

	filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=3,MakeShadow=true,ShadowOpacity=0.10);
	-ms-filter: "progid:DXImageTransform.Microsoft.Blur(PixelRadius=3,MakeShadow=true,ShadowOpacity=0.10)";
	zoom: 1;
	*/
}


 /* Default / Featured ---*/

ul.check  { list-style-image:url('../images/check.jpg'); padding-bottom: 14px; padding-left: 50px;}
.check li { /*font-size: 15px; */}
.featured_ribbon { width: 122px; height: 123px; position: absolute; margin: -8px 0  0 -6px; background: url("../images/featured_ribbon.png") no-repeat; }
.featured_content { position: relative;	padding: 0;	background-color: #fff; }
.featured_content h1 { font-size: 32px; font-weight: 700;  padding:20px 0 15px 15px; margin:0; }
.featured_content img { width:97%; padding: 10px; }
.featured_cost { clear: both; padding:10px 0;	margin: 0px; background-color: #e9e9e9;}
.details { padding: 15px 0 0 15px;  }
.details a { font-size: 18px; font-weight: 400; margin:0; color: #444444; text-decoration: none;}
.cost { float: right; font-size: 38px; font-weight: 700;  padding:0; margin:0; text-align: right;  }
.buy { padding: 10px 0; float: right;}
.buy a { background-color: #073351; padding:10px 50px; color:#fff; font-size: 22px; font-weight: 700; text-decoration:none; 	text-shadow: 1px 1px 0px #073351; }
.buy a:hover { background-color: #a8261e; color: #FFF; }


table.login { padding: 0px; margin:0; }
table.login tr td { font: normal 12px Sans serif, Arial; }

div#info { position: fixed; bottom: 0px; width: 100%; height: 25px; background: #e9e9e9; border-top: 1px solid #d0d0d0; }
div#info { font: normal 12px Sans serif, Arial; padding: 5px; padding-left: 20px; padding-bottom: 0px; margin: 0px; }

div.errors { width: 400px; height: auto; padding-top: 10px; padding-bottom: 10px; border: 1px solid black; background-color: #e9e9e9; text-align: center; vertical-align: middle; }
div.errors p { font: normal 13px Sans serif, Arial; color: #d00000; }


 /*  TABLE STYLES  ------------------------------------------------------------------------------------*/


table.data-area, table.order-area tr td { vertical-align: top; border-spacing: 0; }
table.data-area { width: 80%; border: 1px solid #d0d0d0; }
table.data-area thead tr td { border-spacing: 0px; background-color: #e0e0e0; padding: 5px 5px; border-top: none; }
table.data-area thead tr:hover td { background-color: #e0e0e0; }
table.data-area thead tr td { font: bold 12px  Sans serif, Arial; color: #505050; text-shadow: #c0c0c0 2px 2px; }
table.data-area tr td { border-spacing: 0px; background-color: white; padding: 8px 10px 5px 10px; border-top: 1px solid #d0d0d0; }
table.data-area tr td { font: normal 11px  Sans serif, Arial; color: #505050; }
table.data-area tr:hover td { background-color: #f4f7bb; }
table.data-area tr.new td { font-weight: bold; }
table.data-area tr td * { padding: 0; margin: 0; }

table.order-area, table.order-area tr td { vertical-align: top; border-spacing: 0; }
table.order-area { width: 80%; border: 1px solid #d0d0d0; }
table.order-area thead tr td { border-spacing: 0px; background-color: #e0e0e0; padding: 5px 10px; border-top: none; }
table.order-area thead tr:hover td { background-color: #e0e0e0; }
table.order-area thead tr td p { font: bold 12px  Sans serif, Arial; color: #505050; text-shadow: #c0c0c0 2px 2px; }
table.order-area tr td { border-spacing: 0px; background-color: white; padding: 8px 10px 5px 10px; border-top: 1px solid #d0d0d0; }
table.order-area tr td p { font: normal 11px  Sans serif, Arial; color: #505050; }
table.order-area tr:hover td { background-color: #f4f7bb; }
table.order-area tr td:last-child { text-align: right; }
table.order-area tr.new td { font-weight: bold; }

table.data-form, table.data-form tr td { vertical-align: center; border-spacing: 0; }
table.data-form { width: 80%; border: 1px solid #d0d0d0; }
table.data-form thead tr td { border-spacing: 0px; background-color: #e0e0e0; padding: 5px 10px; border-top: none; }
table.data-form thead tr:hover td { background-color: #e0e0e0; }
table.data-form thead tr td { font: bold 12px  Sans serif, Arial; color: #505050; text-shadow: #c0c0c0 2px 2px; }
table.data-form tr td { border-spacing: 0px; background-color: white; padding: 8px 10px 5px 10px; border-top: 1px solid #d0d0d0; }
table.data-form tr td { font: normal 11px t Sans serif, Arial; color: #505050; }
table.data-form tr:hover td { background-color: #f4f7bb; }
table.data-form tr.new td { font-weight: bold; }
table.data-form tr td * { padding: 0; margin: 0; }
table.data-form tr td.banner { border-spacing: 0px; background-color: #e0e0e0; padding: 5px 10px; border-top: none; }
table.data-form tr td.banner { font: bold 12px  Sans serif, Arial; color: #505050; text-shadow: #c0c0c0 2px 2px; }






 /*Hide / or resize if screen is too small ---*/
@media only screen and (max-width : 480px) {
  .online {  display: none;	}
  .tag {  display: none;	}
  .call {  display: none;	}
  .featured_content h1 { font-size: 28px; font-weight: 700;  padding:20px 0 0 15px; margin:0; }
  .check li { font-size: 13px; }
}



.PictogramGame {
position: relative;
padding-top: 25px;
padding-bottom: 67.5%;
height: 0;
margin-bottom: 16px;
overflow: hidden;
}

.PictogramGame.widescreen { padding-bottom: 57.25%; }
.PictogramGame.vimeo { padding-top: 0; }

.PictogramGame iframe,
.PictogramGame object,
.PictogramGame embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
@media only screen and (max-device-width: 800px), only screen and (device-width: 1024px) and (device-height: 600px), only screen and (width: 1280px) and (orientation: landscape), only screen and (device-width: 800px), only screen and (max-width: 767px) {
.PictogramGame { padding-top: 0; }
}