/*
 * content.css
 *
 * Definicie stylov pre obsah, ktory je editovany cez TinyMCE. Vdaka tomuto suboru
 * sa text pocas editovania a po ulozeni bude zobrazovat uplne rovnako.
 *
 * Vsetky styly je potrebne nadefinovat ako vnorene elementy tychto rodicov:
 *  - div.content-text (text stranky z modulu Content)
 *  - body.mceContentBody (text v editore TinyMCE)
 *
 */



/*** Body ***/

body, td, th, textarea, input, select {
    font-family: Arial, Verdana, Helvetica, sans-serif;
    font-size: 12px;
}

div.with-background {
	background: #ffffff;
	padding: 10px;
}

body {
    color: #707070;
}

body.mceContentBody {
	color: #707070;
	font-size: 11px;
}


div.content-text {
	color: #707070;
	font-size: 11px;
}

.clear {
    float: none;
    clear: both;
    font-size: 0px;
}

body.mceContentBody table td,
div.content-text table td {
	font-size: 11px;
	color: #707070;
}


/*** Fonts ***/

@font-face { 
    font-family: 'qlassik_tb';
    src: url('fonts/qlassik_tb-grape.eot');
    src: url('fonts/qlassik_tb-grape.eot?#iefix') format('embedded-opentype'), 
         url('fonts/qlassik_tb-grape.woff') format('woff'), 
         url('fonts/qlassik_tb-grape.ttf') format('truetype'), 
         url('fonts/qlassik_tb-grape.svg#webfont') format('svg');
}

@font-face { 
    font-family: 'qlassikbold_tb';
    src: url('fonts/qlassikbold_tb-grape.eot');
    src: url('fonts/qlassikbold_tb-grape.eot?#iefix') format('embedded-opentype'), 
         url('fonts/qlassikbold_tb-grape.woff') format('woff'), 
         url('fonts/qlassikbold_tb-grape.ttf') format('truetype'), 
         url('fonts/qlassikbold_tb-grape.svg#webfont') format('svg');
}

@font-face { 
    font-family: 'bebas';
    src: url('fonts/bebas___-grape.eot');
    src: url('fonts/bebas___-grape.eot?#iefix') format('embedded-opentype'), 
         url('fonts/bebas___-grape.woff') format('woff'), 
         url('fonts/bebas___-grape.ttf') format('truetype'), 
         url('fonts/bebas___-grape.svg#webfont') format('svg');
}

/*** templates ***/

table.two-column-layout,
body.mceContentBody table.two-column-layout {
	position: relative;
	/*min-height: 420px;*/
	margin: 0px;
	padding: 0px;
	vertical-align: top;
	border: 0px;
	height: 100%;
}

table.two-column-layout td.first-column,
body.mceContentBody table.two-column-layout td.first-column {
	width: 400px;
	padding: 0px;
	margin: 0px;
	position: relative;
	overflow: hidden;
	padding-right: 5px;
	vertical-align: top;
}

table.two-column-layout td.second-column,
body.mceContentBody table.two-column-layout td.second-column {
	width: 400px;
	position: relative;
	padding: 0px;
	margin: 0px;
	overflow: hidden;
	vertical-align: top; 
}




table.content-box,
body.mceContentBody table.content-box {
	position: relative;
	background: #f3f3f4;
	color: #636466;
	padding: 0px;
	margin: 0px;
	margin-top: 5px;
	margin-bottom: 0px;
	padding-bottom: 0px;
	vertical-align: top;
	border: 0px;
	width: 100%;   
}

table.content-box tbody,
body.mceContentBody table.content-box tbody {
	vertical-align: top;
	margin: 0px;
	padding: 0px;
	width: 100%;   
}     

table.content-box td,
body.mceContentBody table.content-box td {
	padding: 0px;
	margin: 0px;
	padding-top: 10px;
	padding-bottom: 10px;
	border: 0px;
	vertical-align: top;
	border: 0px;
	width: 100%;      
}

table.content-box td.caption,
body.mceContentBody table.content-box td.caption {
	color: #ffffff;
	font-size: 12px;
	padding-top: 3px;
	padding-bottom: 3px;
	text-transform: uppercase;
	background: #464646;
	padding-left: 10px;
	padding-right: 10px;
	font-weight: bold;
	height: 14px;
	overflow: hidden;   
}

table.content-box p,
body.mceContentBody table.content-box p {
	color: #636466;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 0px;
	padding-top: 0px;
	font-size: 12px;
	
}

div.content-box div.text a,
body.mceContentBody div.content-box p a {
	color: #ec008c;
	text-decoration: none;
}

/*** dark ***/

table.dark td.caption,
body.mceContentBody table.dark td.caption {
	color: #ffffff;
	background: #262324;
}


/*** pink ***/

table.pink,
body.mceContentBody table.pink {
	background: #ec008c;
}

table.pink td.caption,
body.mceContentBody table.pink td.caption {
	color: #ec008c;
	background: #ffffff;
}

table.pink p,
body.mceContentBody table.pink p {
	background: #ec008c;
	color: #ffffff;
}




/*** pink-dark ***/

table.pink-dark,
body.mceContentBody table.pink-dark {
	background: #ec008c;
}

table.pink-dark td.caption,
body.mceContentBody table.pink-dark td.caption {
	color: #ffffff;
	background: #821151;
}

table.pink-dark p,
body.mceContentBody table.pink-dark p {
	background: #ec008c;
	color: #ffffff;
}

/*** divider ***/

div.content-text div.divider,
body.mceContentBody div.divider,
table.content-box div.divider,
body.mceContentBody table.content-box div.divider {
	position: relative;
	border-bottom: 1px solid #c3c3c4;
	padding-top: 0px;
	margin-top: -3px;
	margin-bottom: 4px;
	font-size: 0px;
	margin-left: 10px;
	margin-right: 10px;
}

/*** Headers ***/

h1, .h1 {
    margin: 5px 0px 8px 0px;
    padding: 0px;
	font-family: qlassik_tb;
}

h1, h1 a, .h1, div.cms-form input.h1, div.cms-form div.content-title-input input {
    color: #362f2d;
    font-weight: normal;
}

h1, .h1, div.cms-form input.h1, div.cms-form div.content-title-input input {
    font-size: 24px;
}

h2, h3, h4, h5, h6 {
    font-weight: normal;
    padding: 0px 0px 0px 0px;
    margin: 2px 0px;
    color: #362f2d;
	font-family: qlassik_tb;
}

h2 {
    font-size: 22px;
}

h3 {
    font-size: 20px;
}

h4 {
    font-size: 17px;
}

h5 {
    font-size: 15px;
    font-weight: bold;
}

h6 {
    font-size: 12px;
    font-weight: bold;
}

div.content-text h1,
div.content-text h2,
div.content-text h3,
div.content-text h4,
div.content-text h5,
div.content-text h6 {
	color: #36b3de;
}

body.mceContentBody h1,
body.mceContentBody h2,
body.mceContentBody h3,
body.mceContentBody h4,
body.mceContentBody h5,
body.mceContentBody h6 {
    color: #36b3de;
}



/*** Links ***/

a, body.mceContentBody a {
    color: #707070;
    text-decoration: none;
}

a:hover, body.mceContentBody a:hover {
    text-decoration: none;
}



/*** Paragraphs, etc. ***/

p {
    padding: 0px;
    margin: 0px 0px 5px 0px;
}

pre {
    padding: 0px 0px 0px 12px;
    margin: 0px 0px 5px 0px;
}



/*** Lists ***/

div.content-text ul, div.content-text ol,
body.mceContentBody ul, body.mceContentBody ol
{
    padding-left: 30px;
    margin: 0px 0px 5px 0px;
}

div.content-text ul ul, div.content-text ul ol, div.content-text ol ol, div.content-text ol ul,
body.mceContentBody ul ul, body.mceContentBody ul ol, body.mceContentBody ol ol, body.mceContentBody ol ul
{
    padding-left: 23px;
    margin-bottom: 0px;
}

div.content-text li,
body.mceContentBody li
{
}

