/* MAIN LAYOUT */
html{background:url(../images/html-background.gif);}
body {
    margin: 0 auto;
    min-width: 240px; 
	width:95%;
    -webkit-text-size-adjust: none; /* The text size is not adjusted for Safari on iPhone */
}
body * {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
	.ie7 body,
	.ie8 body {
	    min-width: 860px;
	}
	.inner {
	    margin: 0 auto;
	}
	.ie6 .inner {
	    width: 960px;
	}
	.no-sidebar .content-container {
	    float: left;
	    width:100%; /* makes content container full width when there is no sidebar */
	}
	.sidebar { /* this is the sidebar element */
	    margin-top: 12px;
	}
	.no-sidebar .sidebar {
		display: none;
	}

/* HEADER */
	.header .inner {
	    padding: 20px 0 45px 0;
	    position: relative;
		text-align: center;
		width:100%;
		background:rgba(255,255,255,0.8);
	}
	.logo {display:inline-block;width:48px;height:42px;margin:0;}
	.logo img{width:100%;height:auto;vertical-align:middle;}
	.brand {
	    color:#000;
	    display:inline-block;
		margin:0;
		padding:5px;
		vertical-align:middle;
		height:56px;
	}
	.brand h1 {
		position:relative;
		font-size:28px;
		margin-top:6px;
		font-family:'helveticathai';
		color:#000;
		letter-spacing:1px;
		line-height:1em;
	}
		
/* Content */
#container{background:#fff;padding:0;}
#cover-img {text-align:center;padding: 58px;}
#cover-img-half {text-align:center;padding: 34px;}

#content {padding: 15px;position:relative;}
#left-box{width:100%;text-align:center;}
.square-content{
	margin: 0;
	visibility: hidden;
}
#right-box, #full-box,#half-width-left, #half-width-right{width:100%;}

/* MIXED */
header:after,
#Root:after,
.search-bar:after,
header .inner:after,
#container:after,
#content:after,
footer:after,
.content-white:after { /* clearfix */
    height: 0;
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
}
.search-bar form input.action,
.header .primary li a,
.footer a { /* adds color transition when links/inputs on hover */
    -moz-transition: color 0.2s;
    -webkit-transition: color 0.2s;
    transition: color 0.2s;
}
.footer a.brand { color: #333; margin-left: 0; }
.footer a.brand:hover { color: #B80000; }
body h1 span.amp {
    font-family: Baskerville,"Goudy Old Style","Palatino","Book Antiqua",Georgia;
    font-style: italic;
}


/* FOOTER */
.footer {
    color: #999;
    padding: 12px 0 13px 0; /* fix spacing below footer */
    font-size:10px;
	line-height:10px;
	text-align:center;
	background:#333;
}
	.footer a {
	    color: #999;
	}
	.footer a:hover {
	    color: #B90000;
	}
	.footer .left {
	    float: left;
	    color: #000;
	    display: block;
	    margin-bottom: 10px;
	}
	.footer .right {
	    float: right;
	    display: block;
	    margin-bottom: 10px;
	}

.translations{position:relative;z-index:51;width:100%;text-align:center;margin:-34px 0 2px 0;}
.translations ul li{display:inline-block;font-size:14px;padding:5px;font-family:'helveticathai';border: solid 1px #660000;}
.translations:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}
.current {color:#fff;background:#660000;}
.link {background:#fff;}
.link a{color:#660000;}
#back-button {
	float:right;
	padding:28px 5px 0 5px;
}
#back-button a {
	color:#660000; 
	border:1px solid #660000; 
	padding:2px 4px;
	background:#fff;
}
#back-button a:hover {
	color:#D80000; 
	border:1px solid #D80000; 
	padding:2px 4px;
}

::-webkit-selection{
    background: #660000;
    color: #fff;
    text-shadow: none;
}
::-moz-selection{
    background: #660000;
    color: #fff;
    text-shadow: none;
}
::selection{
    background: #660000;
    color: #fff;
    text-shadow: none;
}

/* BREAKPOINT 480px */
@media all and (min-width: 480px) {
.logo {width:48px;height:42px;margin:0;}
.brand h1 {font-size:35px;margin:0;}
}
/* BREAKPOINT 640px */
@media all and (min-width: 640px) {
.logo {display:inline-block;width:56px;height:49px;margin:0;}
.brand h1 {font-size:42px;margin:0;}
}
/* BREAKPOINT 768px */
@media all and (min-width: 768px) {
.logo {display:inline-block;width:64px;height:56px;margin:0;}
.brand h1 {font-size:48px;margin:0;}
}

/* BREAKPOINT 1080px */
@media only screen and (min-width: 1080px) {
	body {width:100%;max-width:1080px;margin:0 auto;}
	
	.header .top {border-bottom:35px solid rgba(255,255,255,0.8);border-left:35px solid transparent;}
	.header .inner {padding: 0 0 20px 0;}
	.logo {width:64px;height:56px;margin:0 24px 0 0;padding:0;}
	.brand {color:#000;height:60px;}
	.brand h1 {font-size:48px;}
	
	#cover-img{padding:110px;}
	#cover-img-half {padding:65px;}
	#table-row{width:100%;overflow:hidden;}
	#half-width-left{width:49%;float:left;margin-bottom:-99999px;padding-bottom:99999px;vertical-align:top;border:solid 1px #000;}
	#half-width-right{width:49%;float:right;margin-bottom:-99999px;padding-bottom:99999px;vertical-align:top;border:solid 1px #000;}
	#border-bottom-left{background:#000;height:1px;width:49%;float:left;}
	#border-bottom-right{background:#000;height:1px;width:49%;float:right;}
	
	.translations{width:100px;float:right;margin-top:-40px;}
	.translations ul li{padding:5px;}
	
	#container{background:rgba(220,220,220,0.8);}
	#container-bg{background:url(../images/container-bg.png) bottom left no-repeat;}
	#content {
		width:100%;
		padding: 2% 5%;
	}

	#left-box{width:20%;float:left;}
	.square-box{
		position: relative;
		width: 100%;
		/*overflow: hidden;*/
	}
/*	.square-box:before{
		content: "";
		display: block;
		padding-top: 100%;
	}*/
	.square-content{
		background:rgba(102,0,0,0.7);
		width:100%;
		margin:0;
		padding:15px 0 30px 0;
		visibility:visible;
	}
	/*.square-content div {
	   display: table;
	   width: 100%;
	   height: 100%;
	   padding: 15px;
	}*/
	.top-grey{
		width:100%;
		border-bottom: solid 30px rgba(102,0,0,0.7);
		border-left: solid 30px transparent;
	}
	/*.bottom-grey{
		border-top: solid 30px #ccc;
		border-right: solid 30px transparent;
		position: absolute;
		bottom:1px;
		right:0;
		width:100%;
	}*/

	#right-box{width:80%;float:left;}
	.top-white{
		width:100%;
		border-bottom: solid 30px #fff;
		border-left: solid 30px transparent;
	}
	.top-white-2{
		width:100%;
		border-bottom: solid 30px #fff;
		border-left: solid 30px rgba(102,0,0,0.7);
	}
	.content-white{
		width:100%;
		background:#fff;
		padding: 20px 40px;
	}
	.bottom-white{
		border-top: solid 30px #fff;
		border-right: solid 30px transparent;
		width:100%;
	}
}
@media only screen and (min-width: 1440px) {html{zoom:1.1;-webkit-text-size-adjust:auto;}}
@media only screen and (min-width: 1600px) {html{zoom:1.2;-webkit-text-size-adjust:auto;}}
@media only screen and (min-width: 2048px) {html{zoom:1.4;-webkit-text-size-adjust:auto;}}
/* Print Styles */

/* Based on HTML5 boilerplate print styles */
@media print {
	* {
	    background: transparent !important;
	    color: black !important;
	    box-shadow: none !important;
	    text-shadow: none !important;
	    filter: none !important;
	    -ms-filter: none !important;
	}
	a,
	a:visited {
	    text-decoration: underline
	}
	a[href]:after {
        content: " (" attr(href) ")";
    }
    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

	thead {
	    display: table-header-group
	}
	tr,
	img {
	    page-break-inside: avoid
	}
	img {
	    max-width: 100% !important
	}
	pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }
    @page {
        margin: 0.5cm;
    }
    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }

    /* Simple theme custom print styles */
	.header,
	.footer,
    .nav-open-button,
    .search-bar,
    .search-dropdown-icon,
    nav.primary {
	    display: none;
	}
}