/*****************************************************************************************
	
                        Веб-интерфейс игровой системы hobro
                            (C) 2011-2017 Сергей Соболев
                                (С) Ходилки Бродилки
                                
*****************************************************************************************/

/* --desc-- Общие стили сайта --desc-- */

	body {font-family: 'PT Sans', sans-serif; font-size:120%; margin:0; padding:0; padding-left:0px; -webkit-text-size-adjust: none; background:#000;}
	.preContent {background:#fff;}
	body,
	body div,
	body p,
	td {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
	table,
	td, 
	tr {font-family: 'PT Sans', sans-serif; }
	table {border-collapse:collapse; font-size:100%;}
	table td {/*border:1px solid #ccc;*/ padding:0;}
	a {color:#db0000;}
	a:visited {color:#800000;}
	a:hover {background:#db0000; color:#ffffff;}
	a.aImaged {background:transparent; color:transparent;}
	a img, 
	a:hover img, img:hover {border:0px; outline:0px;}
	
	.hobroImageSwitcher img:first-child {display:block;}
	.hobroImageSwitcher img:last-child {display:none;}
	.hobroImageSwitcher:hover img:first-child {display:none;}
	.hobroImageSwitcher:hover img:last-child {display:block;}

	.invisible { display:none; }
	.fontSizeSmall {font-size:65%; line-height:100%;}
	.fontSizeSmaller {font-size:smaller;}
	.fsSmaller {font-size:smaller;}
	.fs90 {font-size:90%;}
	.colorLight {color:#555555;}
	.colorMediumLight {color:#888888;}
	.colorExtraLight {color:#bbbbbb;}
	.colorRed {color:#db0000; }
	.colorWhite {color:#ffffff;}
	.bgRed {background-color:#db0000; }
	.bgBlack {background-color:#000000; }
	.bgGray {background-color:#808080; }
	.bgLightGray {background-color:#ddd; }
	.bgExtraLightGray {background-color:#f2f2f2; }
	
	.vaTop {vertical-align:top;}
	.vaMiddle {vertical-align:middle;}
	/*.lineUp {background-image:url("/IBD?url=/image/HB/doubleLine1.png"); background-repeat:repeat-x; height:8px; margin-bottom:15px}*/
	/*.lineDown {background-image:url("/IBD?url=/image/HB/doubleLine2.png"); background-repeat:repeat-x; height:8px; margin-top:15px;}*/
	.pt0 {padding-top:0;}
	.pb0 {padding-bottom:0;}
	.mt0 {margin-top:0;}
	.mb0 {margin-bottom:0;}

	.pl02cm, .pl02 {padding-left:0.2cm;}

	.pt025cm, .pt025 {padding-top:0.25cm;}
	.pb025cm, .pb025 {padding-bottom:0.25cm;}
	.mt025 {margin-top:0.25cm;}
	.mb025 {margin-bottom:0.25cm;}

	.pt05 {padding-top:0.5cm;}
	.pb05 {padding-bottom:0.5cm;}
	.mt05 {margin-top:0.5cm;}
	.mb05 {margin-bottom:0.5cm;}

	.pb1cm, .pb1 {padding-bottom:1cm;}
	.pt1 {padding-top:1cm;}
	.mt1 {margin-top:1cm;}
	.mb1 {margin-bottom:1cm;}

	.pt2 {padding-top:2cm;}
	.pb2 {padding-bottom:2cm;}
	.mt2 {margin-top:2cm;}
	.mb2 {margin-bottom:2cm;}

	.width {width:100%; height:auto;}
	.width75 {width:75%; height:auto;}
	.width50 {width:50%; height:auto;}
	.width100 {width:100%; height:auto;}
	.taCenter {text-align:center;}
	
	video.autosized {width:50%; height:auto;}
	.log {font-size:50%}
		
	.bodyContent {margin: 0 auto; width:100%; max-width:26.58cm; padding-top:0.5cm;}
	
	.centeredBlock {margin:0 auto;}
	.defaultPageWidth {max-width:26.58cm;}
	.autoPaddings {padding:0;}
	.startFromNewLine {clear:left;}
	
	/*.content h2 {font-size:250%; font-weight:normal; margin:0; font-family: 'Poiret One', sans-serif; margin-bottom:1cm; margin-top:3cm;}*/
	h2 {font-size:450%; font-weight:normal; margin:0; /*font-family: 'Poiret One', sans-serif;*/ padding-bottom:2cm; padding-top:2cm; text-align:center;}
	h2.first {padding-top:2cm;}
	
	.like {padding-bottom:1cm; padding-top:1cm; margin-left:-3px; }
	.like .likeit {margin-left:3px; padding-bottom:0.25cm;}
	
	.autoColumns2 {columns:2; -moz-columns:2; -webkit-columns:2;}
	
	/*.cell {display:table-cell;}
	.row {display:table-row;}*/
	
@media only screen and (max-width: 30.00cm) {
}
	
@media only screen and (max-width: 26.58cm) {
	body .preContent {/*background:#ffed8c;*/} /*yellow*/
	.autoPaddings {padding-left:0.2cm; padding-right:0.2cm;}
}

@media only screen and (max-width: 23cm) {
	body .preContent {background:#fff;}
}

@media only screen and (max-width: 17cm) {
	body .preContent {/*background:#ddffdd;*/} /* green */
	.content h2 {font-size:320%;}
	video.autosized {width:100%; height:auto;}
	.autoColumns2 {columns:1; -moz-columns:1; -webkit-columns:1;};
}

	@media only screen and (max-width: 12cm) {
		body .preContent {background:#fff;}
		.content h2 {font-size:230%; margin-top:2cm;}
	}

	@media only screen and (max-width: 8cm) {
	}