/*============================================

TileBox CSS by SONHLAB.com - version 1.0
Website: http://sonhlab.com
Documentation: http://docs.sonhlab.com/tilebox-modernresponsive-lightbox-css/

============================================*/




/*========== START SHADOW LIST ==========*/
.shadow-white,
.shadow-black,
.shadow-blue,
.shadow-green,
.shadow-red,
.shadow-orange {
	text-decoration:none;
}
.shadow-white {
	box-shadow:0px 0px 6px 3px #fff;
	-webkit-box-shadow:0px 0px 6px 3px #fff;
	-moz-box-shadow:0px 0px 6px 3px #fff;
	-o-box-shadow:0px 0px 6px 3px #fff;
	-ms-box-shadow:0px 0px 6px 3px #fff;
}
.shadow-blue {
	box-shadow:0px 0px 6px 3px #38D1F7;
	-webkit-box-shadow:0px 0px 6px 3px #38D1F7;
	-moz-box-shadow:0px 0px 6px 3px #38D1F7;
	-o-box-shadow:0px 0px 6px 3px #38D1F7;
	-ms-box-shadow:0px 0px 6px 3px #38D1F7;
}
.shadow-green {
	box-shadow:0px 0px 6px 3px #AACA37;
	-webkit-box-shadow:0px 0px 6px 3px #AACA37;
	-moz-box-shadow:0px 0px 6px 3px #AACA37;
	-o-box-shadow:0px 0px 6px 3px #AACA37;
	-ms-box-shadow:0px 0px 6px 3px #AACA37;
}
.shadow-red {
	box-shadow:0px 0px 6px 3px #E81750;
	-webkit-box-shadow:0px 0px 6px 3px #E81750;
	-moz-box-shadow:0px 0px 6px 3px #E81750;
	-o-box-shadow:0px 0px 6px 3px #E81750;
	-ms-box-shadow:0px 0px 6px 3px #E81750;
}
.shadow-black {
	box-shadow:0px 0px 6px 3px #111;
	-webkit-box-shadow:0px 0px 6px 3px #111;
	-moz-box-shadow:0px 0px 6px 3px #111;
	-o-box-shadow:0px 0px 6px 3px #111;
	-ms-box-shadow:0px 0px 6px 3px #111;
}
.shadow-orange {
	box-shadow:0px 0px 6px 3px #FF6600;
	-webkit-box-shadow:0px 0px 6px 3px #FF6600;
	-moz-box-shadow:0px 0px 6px 3px #FF6600;
	-o-box-shadow:0px 0px 6px 3px #FF6600;
	-ms-box-shadow:0px 0px 6px 3px #FF6600;
}

/*========== END SHADOW LIST ==========*/




/*========== START HOVER SHADOW LIST ==========*/
.hovershadow-white,
.hovershadow-black,
.hovershadow-blue,
.hovershadow-green,
.hovershadow-red,
.hovershadow-orange {
	text-decoration:none;
}
.hovershadow-white:hover {
	box-shadow:0px 0px 6px 3px #fff;
	-webkit-box-shadow:0px 0px 6px 3px #fff;
	-moz-box-shadow:0px 0px 6px 3px #fff;
	-o-box-shadow:0px 0px 6px 3px #fff;
	-ms-box-shadow:0px 0px 6px 3px #fff;
}
.hovershadow-blue:hover {
	box-shadow:0px 0px 6px 3px #38D1F7;
	-webkit-box-shadow:0px 0px 6px 3px #38D1F7;
	-moz-box-shadow:0px 0px 6px 3px #38D1F7;
	-o-box-shadow:0px 0px 6px 3px #38D1F7;
	-ms-box-shadow:0px 0px 6px 3px #38D1F7;
}
.hovershadow-green:hover {
	box-shadow:0px 0px 6px 3px #AACA37;
	-webkit-box-shadow:0px 0px 6px 3px #AACA37;
	-moz-box-shadow:0px 0px 6px 3px #AACA37;
	-o-box-shadow:0px 0px 6px 3px #AACA37;
	-ms-box-shadow:0px 0px 6px 3px #AACA37;
}
.hovershadow-red:hover {
	box-shadow:0px 0px 6px 3px #E81750;
	-webkit-box-shadow:0px 0px 6px 3px #E81750;
	-moz-box-shadow:0px 0px 6px 3px #E81750;
	-o-box-shadow:0px 0px 6px 3px #E81750;
	-ms-box-shadow:0px 0px 6px 3px #E81750;
}
.hovershadow-black:hover {
	box-shadow:0px 0px 6px 3px #444;
	-webkit-box-shadow:0px 0px 6px 3px #444;
	-moz-box-shadow:0px 0px 6px 3px #444;
	-o-box-shadow:0px 0px 6px 3px #444;
	-ms-box-shadow:0px 0px 6px 3px #444;
}
.hovershadow-orange:hover {
	box-shadow:0px 0px 6px 3px #FF6600;
	-webkit-box-shadow:0px 0px 6px 3px #FF6600;
	-moz-box-shadow:0px 0px 6px 3px #FF6600;
	-o-box-shadow:0px 0px 6px 3px #FF6600;
	-ms-box-shadow:0px 0px 6px 3px #FF6600;
}
/*========== END HOVER SHADOW LIST ==========*/




/*========== START BACKGROUND LIST ==========*/

/* Solid Colors */
.solid-lightblue { background:#E4F0F7; }
.solid-blue { background:#00BBE2; }
.solid-blue-2 { background:#2C84EE; }
.solid-darkblue { background:#044E94; }
.solid-violetred { background:#781766; }
.solid-red { background:#E51400;}
.solid-red-2 { background:#E81750; }
.solid-pink { background:#FF539B; }
.solid-purple { background:#D02090; }
.solid-orange { background:#FB8F02; }
.solid-orange-2 { background:#FF6600; }
.solid-orange-3 { background:#DD5F37; }
.solid-coral { background:#CD5B45; }
.solid-lightgreen { background:#F5FFFA; }
.solid-green { background:#67B239; }
.solid-green-2 {background:#96BF01; }
.solid-darkgreen { background:#016C38; }
.solid-olive { background:#999900}
.solid-grass { background:#CDCD00; }
.solid-darkred { background:#5F0000; }
.solid-gold { background:#FEE9AE; }
.solid-yellow { background:#F7D100; }
.solid-black { background:#000; }
.solid-smoke { background:#F5F5F5; }
.solid-white { background:#fff; }
.solid-jade { background:#00CE9B; }
/* End Solid Colors */

/* Transparent Colors */
.transparent-deepsea {
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#33003564, endColorstr=#33003564);/* For IE 5.5 - 7*/
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#33003564, endColorstr=#33003564)";/* For IE 8*/
	background: rgba(0,53,100,0.2);/* Modern browser */
}
.transparent-smoke {
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#33f5f5f5, endColorstr=#33f5f5f5);/* For IE 5.5 - 7*/
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#33f5f5f5, endColorstr=#33f5f5f5)";/* For IE 8*/
	background: rgba(245,245,245,0.2);/* Modern browser */
}
.transparent-grass {
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#33CDCD00, endColorstr=#33CDCD00);/* For IE 5.5 - 7*/
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#33CDCD00, endColorstr=#33CDCD00)";/* For IE 8*/
	background: rgba(205,250,0,0.2);/* Modern browser */
}
.transparent-black {
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#33000000, endColorstr=#33000000);/* For IE 5.5 - 7*/
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#33000000, endColorstr=#33000000)";/* For IE 8*/
	background: rgba(0,0,0,0.2);/* Modern browser */
}
.transparent-darknight {
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);/* For IE 5.5 - 7*/
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";/* For IE 8*/
	background: rgba(0,0,0,0.6);/* Modern browser */
}
.transparent-red {
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#33FF0000, endColorstr=#33FF0000);/* For IE 5.5 - 7*/
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#33FF0000, endColorstr=#33FF0000)";/* For IE 8*/
	background: rgba(255,0,0,0.2);/* Modern browser */
}
.transparent-violetred {
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#33D02090, endColorstr=#33D02090);/* For IE 5.5 - 7*/
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#33D02090, endColorstr=#33D02090)";/* For IE 8*/
	background: rgba(208,32,144,0.2);/* Modern browser */
}
.transparent-green {
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#3367B239, endColorstr=#3367B239);/* For IE 5.5 - 7*/
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#3367B239, endColorstr=#3367B239)";/* For IE 8*/
	background: rgba(103,178,57,0.2);/* Modern browser */
}
.transparent-yellow {
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#33FFFF00, endColorstr=#33FFFF00);/* For IE 5.5 - 7*/
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#33FFFF00, endColorstr=#33FFFF00)";/* For IE 8*/
	background: rgba(255,255,0,0.2);/* Modern browser */
}
.transparent-orange { 
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#33FB8F02, endColorstr=#33FB8F02);/* For IE 5.5 - 7*/
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#33FB8F02, endColorstr=#33FB8F02)";/* For IE 8*/
	background: rgba(251,143,2,0.2);/* Modern browser */
}
.transparent-coral {
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#33CD5B45, endColorstr=#33CD5B45);/* For IE 5.5 - 7*/
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#33CD5B45, endColorstr=#33CD5B45)";/* For IE 8*/
	background: rgba(205,91,69,0.2);/* Modern browser */
}
.transparent-wheat {
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#33EED8AE, endColorstr=#33EED8AE);/* For IE 5.5 - 7*/
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#33EED8AE, endColorstr=#33EED8AE)";/* For IE 8*/
	background: rgba(238,216,174,0.2);/* Modern browser */
}
.transparent-redwine {
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#338B0000, endColorstr=#338B0000);/* For IE 5.5 - 7*/
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#338B0000, endColorstr=#338B0000)";/* For IE 8*/
	background: rgba(139,0,0,0.2);/* Modern browser */
}
.transparent-mist {
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99FFFFFF, endColorstr=#99FFFFFF);/* For IE 5.5 - 7*/
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99FFFFFF, endColorstr=#99FFFFFF)";/* For IE 8*/
	background: rgba(255,255,255,0.6);/* Modern browser */
}
/* End Transparent Colors */

/* Background Images */
.img-wood { background:#FB8F02 url(../images/bg/wood_pattern.jpg) repeat; }
.img-purtywood { background:#FB8F02 url(../images/bg/purty_wood.jpg) repeat; }
.img-woodtexture { background:#FB8F02 url(../images/bg/wood_texture.jpg) repeat; }
.img-darkwood { background:#000 url(../images/bg/dark_wood.jpg) repeat; }
.img-retinawood { background:#FB8F02 url(../images/bg/retina_wood.png) repeat; }
.img-nastyfabric { background:#999 url(../images/bg/nasty_fabric.png) repeat; }
.img-wildoliva { background:#555 url(../images/bg/wild_oliva.png) repeat; }
.img-darkbrick { background:#555 url(../images/bg/dark_brick_wall.png) repeat; }
.img-navyblue { background:#555 url(../images/bg/navy_blue.png) repeat; }
/* End Background Images */

/*========== END BACKGROUND LIST ==========*/







/*========== START TILEBOX CSS ==========*/
.ctrlitem {
	cursor:pointer;
}

.tilebox, .fitsize {
	display:none;
}
.box-content {
	display:none;
	position:fixed;
	z-index:9998;
	width:100%;
	height:100% !important;
	top:0;
	left:0;
	overflow:hidden;	
}

.box-content > .box-img {
	width:100%;
	height:100%;
	overflow:hidden;
	position:relative;
	border:0px;
	display:table;
}
.box-content > .box-img > .main-img {
	position:relative;
	width:100%;
	height:100%;
	display: table-cell;
    vertical-align: middle;
}
.box-content > .box-img > .main-img > img {
	width:100%;
	height:auto;
	position:relative;
}

.box-closebt {
	width:32px;
	height:32px;
	position:absolute;
	top:5px;
	right:5px;
	z-index:9999;
	cursor:pointer;
}
.box-infobt {
	width:32px;
	height:32px;
	position:absolute;
	top:5px;
	right:79px;
	z-index:9999;
	cursor:pointer;
	text-align:center;
}
.box-fitsizebt {
	width:32px;
	height:32px;
	position:absolute;
	top:5px;
	right:42px;
	z-index:9999;
	cursor:pointer;
}
.box-sharebt {
	width:32px;
	height:32px;
	position:absolute;
	top:5px;
	right:116px;
	z-index:9999;
	cursor:pointer;
	text-align:center;
}
.box-closebt > span,
.box-infobt > span {
	font-size:24px;
	line-height:32px;
	font-weight:bold;
}



/* Start Info Box */
.box-info {
	display:none;
}
.box-info-content {
	z-index:9999;
	position:absolute;
	bottom:0;
	left:0;
	overflow:hidden;
	display:none;
	width:100%;
	max-height:100%;
}

.box-info-content > .info-closebt {
	width:32px;
	height:32px;
	position:absolute;
	z-index:9999;
	cursor:pointer;
	right:10px;
	top:0px;
}
.box-info-content > .info-closebt > span {
	font-size:24px;
	line-height:32px;
}

.box-info-content p {
	font-size:14px;
	line-height:22px;
	padding:20px 20px 0 20px;
}
.box-info-content p:last-child {
	padding:20px;
}

.box-info-content .info-title {
	font-size:32px;
	line-height:1;
	font-family:"Dosis",sans-serif;
	text-transform:uppercase;
}
/* End Info Box */



/* Show TileBox */
.tilebox:checked + .box-content {
	display:block;
}

.box-info:checked + .box-info-content {
	display: block;
}

.fitsize:checked + .box-img {
	display:block;
}
.fitsize:checked + .box-img > .main-img {
	height:100%;
	width:100%;
	position:relative;
	top:0;
	display:block;
	margin:auto;
	text-align:center;
}
.fitsize:checked + .box-img > .main-img > img {
	position:relative;
	margin:auto;
	height:100%;
	width:auto;
}

.tilebox:checked + .box-flip,
.box-info:checked + .box-flip {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-backface-visibility: visible !important;
	-webkit-animation-name: flip;
	-moz-backface-visibility: visible !important;
	-moz-animation-name: flip;
	backface-visibility: visible !important;
	animation-name: flip;
}
.tilebox:checked + .box-flipInX,
.box-info:checked + .box-flipInX {
	-webkit-backface-visibility: visible !important;
	-webkit-animation-name: flipInX;
	-moz-backface-visibility: visible !important;
	-moz-animation-name: flipInX;
	-o-backface-visibility: visible !important;
	-o-animation-name: flipInX;
	backface-visibility: visible !important;
	animation-name: flipInX;
}
.tilebox:checked + .box-flipInY,
.box-info:checked + .box-flipInY {
	-webkit-backface-visibility: visible !important;
	-webkit-animation-name: flipInY;
	-moz-backface-visibility: visible !important;
	-moz-animation-name: flipInY;
	-o-backface-visibility: visible !important;
	-o-animation-name: flipInY;
	backface-visibility: visible !important;
	animation-name: flipInY;
}
.tilebox:checked + .box-fadeIn,
.box-info:checked + .box-fadeIn {
	-webkit-animation-name: fadeIn;
	-moz-animation-name: fadeIn;
	-o-animation-name: fadeIn;
	animation-name: fadeIn;
}
.tilebox:checked + .box-fadeInUp,
.box-info:checked + .box-fadeInUp {
	-webkit-animation-name: fadeInUp;
	-moz-animation-name: fadeInUp;
	-o-animation-name: fadeInUp;
	animation-name: fadeInUp;
}
.tilebox:checked + .box-fadeInDown,
.box-info:checked + .box-fadeInDown {
	-webkit-animation-name: fadeInDown;
	-moz-animation-name: fadeInDown;
	-o-animation-name: fadeInDown;
	animation-name: fadeInDown;
}
.tilebox:checked + .box-fadeInLeft,
.box-info:checked + .box-fadeInLeft {
	-webkit-animation-name: fadeInLeft;
	-moz-animation-name: fadeInLeft;
	-o-animation-name: fadeInLeft;
	animation-name: fadeInLeft;
}
.tilebox:checked + .box-fadeInRight,
.box-info:checked + .box-fadeInRight {
	-webkit-animation-name: fadeInRight;
	-moz-animation-name: fadeInRight;
	-o-animation-name: fadeInRight;
	animation-name: fadeInRight;
}
.tilebox:checked + .box-fadeInUpBig,
.box-info:checked + .box-fadeInUpBig {
	-webkit-animation-name: fadeInUpBig;
	-moz-animation-name: fadeInUpBig;
	-o-animation-name: fadeInUpBig;
	animation-name: fadeInUpBig;
}
.tilebox:checked + .box-fadeInDownBig,
.box-info:checked + .box-fadeInDownBig {
	-webkit-animation-name: fadeInDownBig;
	-moz-animation-name: fadeInDownBig;
	-o-animation-name: fadeInDownBig;
	animation-name: fadeInDownBig;
}
.tilebox:checked + .box-fadeInLeftBig,
.box-info:checked + .box-fadeInLeftBig {
	-webkit-animation-name: fadeInLeftBig;
	-moz-animation-name: fadeInLeftBig;
	-o-animation-name: fadeInLeftBig;
	animation-name: fadeInLeftBig;
}
.tilebox:checked + .box-fadeInRightBig,
.box-info:checked + .box-fadeInRightBig {
	-webkit-animation-name: fadeInRightBig;
	-moz-animation-name: fadeInRightBig;
	-o-animation-name: fadeInRightBig;
	animation-name: fadeInRightBig;
}

.tilebox:checked + .box-bounceIn,
.box-info:checked + .box-bounceIn {
	-webkit-animation-name: bounceIn;
	-moz-animation-name: bounceIn;
}

.tilebox:checked + .box-bounceInUp,
.box-info:checked + .box-bounceInUp {
	-webkit-animation-name: bounceInUp;
	-moz-animation-name: bounceInUp;
}
.tilebox:checked + .box-bounceInDown,
.box-info:checked + .box-bounceInDown {
	-webkit-animation-name: bounceInDown;
	-moz-animation-name: bounceInDown;
}
.tilebox:checked + .box-bounceInLeft,
.box-info:checked + .box-bounceInLeft {
	-webkit-animation-name: bounceInLeft;
	-moz-animation-name: bounceInLeft;
}
.tilebox:checked + .box-bounceInRight,
.box-info:checked + .box-bounceInRight {
	-webkit-animation-name: bounceInRight;
	-moz-animation-name: bounceInRight;
}
.tilebox:checked + .box-rotateIn,
.box-info:checked + .box-rotateIn {
	-webkit-animation-name: rotateIn;
	-moz-animation-name: rotateIn;
	-o-animation-name: rotateIn;
	animation-name: rotateIn;
}
.tilebox:checked + .box-rotateInUpLeft,
.box-info:checked + .box-rotateInUpLeft {
	-webkit-animation-name: rotateInUpLeft;
	-moz-animation-name: rotateInUpLeft;
	-o-animation-name: rotateInUpLeft;
	animation-name: rotateInUpLeft;
}
.tilebox:checked + .box-rotateInDownLeft,
.box-info:checked + .box-rotateInDownLeft {
	-webkit-animation-name: rotateInDownLeft;
	-moz-animation-name: rotateInDownLeft;
	-o-animation-name: rotateInDownLeft;
	animation-name: rotateInDownLeft;
}
.tilebox:checked + .box-rotateInUpRight,
.box-info:checked + .box-rotateInUpRight {
	-webkit-animation-name: rotateInUpRight;
	-moz-animation-name: rotateInUpRight;
	-o-animation-name: rotateInUpRight;
	animation-name: rotateInUpRight;
}
.tilebox:checked + .box-rotateInDownRight,
.box-info:checked + .box-rotateInDownRight {
	-webkit-animation-name: rotateInDownRight;
	-moz-animation-name: rotateInDownRight;
	-o-animation-name: rotateInDownRight;
	animation-name: rotateInDownRight;
}
.tilebox:checked + .box-lightSpeedIn,
.box-info:checked + .box-lightSpeedIn {
    -webkit-animation-name: lightSpeedIn;
    -moz-animation-name: lightSpeedIn;
    -webkit-animation-timing-function: ease-out;
    -moz-animation-timing-function: ease-out;
}
.tilebox:checked + .box-rollIn,
.box-info:checked + .box-rollIn {
	-webkit-animation-name: rollIn;
	-moz-animation-name: rollIn;
	-o-animation-name: rollIn;
	animation-name: rollIn;
}


/*========== END TILEBOX CSS ==========*/





/* MISC */
.clearspace { clear: both; }
.floatleft { float:left !important; }
.floatright { float:right !important; }
.none { display:none !important; }

.light-text {
	color:#fff;
}
.dark-text {
	color:#1e1e1e;
}
.light-border {
	border:1px solid #fff;
}
.dark-border {
	border:1px solid #000;
}
.top-red-border {
	border-top:5px solid #E51400;
}
.top-black-border {
	border-top:5px solid #000;
}
.gradient {
	background: -moz-linear-gradient(-45deg,  rgba(255,255,255,0) 0%, rgba(255,255,255,0.3) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,0.3))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(-45deg,  rgba(255,255,255,0) 00%,rgba(255,255,255,0.3) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(-45deg,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(-45deg,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 100%); /* IE10+ */
	background: linear-gradient(-45deg,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 100%); /* W3C */
}
