/*
Theme Name: Frame
Theme URI: http://filipstransky.cz
Description: Web vytvořil <a href="http://filipstransky.cz">Filip Stránský</a>.
Version: 1.1
Author: Filip Stránský
Author URI: http://filipstransky.cz
Tags: prest
Text Domain: frame

	Frame v1.1
	 http://filipstransky.cz

	Tato šablona je vytvořena Filipem


*/




/* ------------------------ IMPORT ------------------------ */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700&display=swap');


@import "../frame/css/header.css?version=25.1";
@import "../frame/css/page.css?version=25.1";
@import "../frame/css/post.css?version=25.1";
@import "../frame/css/part.css?version=25.1";
@import "../frame/css/newsletter.css?version=25.1";
@import "../frame/css/footer.css?version=25.1";
@import "../frame/css/single.css?version=25.1";
@import "../frame/css/button.css?version=25.1";
@import "../frame/css/input.css?version=25.1";
@import "../frame/css/content.css?version=25.1";
@import "../frame/css/info.css?version=25.1";
@import "../frame/css/widget.css?version=25.1";
@import "../frame/css/img.css?version=25.1";
@import "../frame/css/text.css?version=25.1";

@import "../frame/css/gap.css?version=25.1";

@import "../frame/css/r.css?version=25.1";


@import "../frame/css/custom.css?version=25.1";

/* ------------------------ EXPORT ------------------------ */
:root {
	/*color*/
	--color: black;
	--color_2: rgb(193, 193, 193);
	--color_light: white;

	--color_main:rgb(77, 47, 145);
	--color_main_2:rgb(236, 227, 256);
	--color_main_3:rgb(75, 173, 186);

	--color_border: rgb(230, 230, 230);
	--color_button: rgb(255,230,195);
	--color_bg: rgb(251, 251, 251);

	--bg: white;
	--bg_2: rgb(248, 242, 230);
	--bg_3: rgb(254, 249, 250);
	--bg_4: rgb(248, 242, 230);

	/*font*/
	--font: 'Open Sans', sans-serif;
	--font_2: 'Open Sans', sans-serif;

	--line_height_normal: 1.25;
	--line_height_big: 1.5;
	--line_height_p: 2;

	--font_size: 15px;
	--button_size:120%;
	--h1_size: 300%;
	--h2_size: 300%;
	--h3_size: 150%;
	--h4_size: 120%;
	--h5_size: 100%;
	--h6_size: 100%;

	--weight_light: var(--weight_regular);
	--weight_regular: 400;
	--weight_semibold: 600;
	--weight_bold: 700;




	/*radius*/
	--radius: 10px;
	--radius_grid:3px;
	--radius_button: 3px;

	/*text align*/
	--align_title: center;
	--align_p:left;

	/*text transform*/
	--text_transform_title: none;
	--text_transform_button: uppercase;

	/*container*/
	--con: calc(100% - 80px);
	--con_max: 1600px;

	--con_page: calc(100% - 200px);
	--con_page_max: 1200px;

	--con_smallpage: calc(100% - 200px);
	--con_smallpage_max: 900px;

	--con_content: calc(100% - 60px);
	--con_content_max: 600px;

	--con_small: calc(100% - 60px);
	--con_small_max: 650px;

	/*shadow*/
	--shadow: 0px 0px 20px 0px rgba(0,0,0,0.05);


	/*transition*/
	--trans: ease 300ms;
	}




/* ------------------------ BASIC STYLES ------------------------ */
b {
	font-weight: var(--weight_bold);
}
a {
	color: inherit;
	text-decoration: inherit;
	font-weight: var(--weight_bold);
}
a, button, input[type="submit"] {
   cursor:pointer;
}
mark {
	background: transparent;
	position: relative;
	white-space: nowrap;
}
mark:after {
	content: '';
	background: rgb(236, 227, 256);
	width: 100%;
	height: 30%;
	position: absolute;
	left: 0;
	bottom: 10%;
	z-index: -1;
}

h1, #title_h1 {
	font-size: var(--h1_size);
	font-weight: var(--weight_bold);
	margin: var(--margin-h1);
	padding: 0px;
	text-transform: var(--text_transform_title);
	text-align: var(--align_title);
	position: relative;
}
h2, #title_h2 {
	font-size: var(--h2_size);
	font-weight: var(--weight_bold);
	margin: var(--margin-h2);
	padding: 0px;
	text-transform: var(--text_transform_title);
	text-align: var(--align_title);
	position: relative;
}
h3, #title_h3 {
	font-size: var(--h3_size);
	font-weight: var(--weight_bold);
	margin: var(--margin-h3);
	padding: 0px;
	text-transform: var(--text_transform_title);
	text-align: var(--align_title);
	position: relative;
}
h4, #title_h4 {
	font-size: var(--h4_size);
	font-weight: var(--weight_bold);
	margin: var(--margin-h4);
	padding: 0px;
	text-transform: var(--text_transform_title);
	text-align: var(--align_title);
	position: relative;
}
#subtitle, .subtitle {
	width: 100%;
	height: auto;
	display: block;
	position: relative;
	margin: var(--margin-subtitle);
	text-align: var(--align_title);
	line-height: var(--line_height_p);
}



/* ------------------------ ICONS ------------------------ */


#icon_h2-before_title {
	width: auto;
	height: 30px;
	margin: var(--margin-icon_h2-before_title);
	display: block;
}

.center {
	text-align: center !important;
}
.left {
	text-align: left !important;
}
.right {
	text-align: right !important;
}
.inline {
	display: inline !important;
	width: auto !important;
}
.inline-block {
	display: inline-block !important;
	width: auto !important;
}






/* ------------------------ BASIC FRAME ------------------------ */
body {
	font-size: var(--font_size);
	font-family: var(--font);
	color: var(--color);
	margin: 0px;
	position: relative;
	display: block;
	padding: 0px;
	}


/* ------------ CONTAINER ------------ */
#con, #con_page, #con_content, #con_small, .con_content, .con_page, .con_smallpage, #con_smallpage, .con_content{
	display: block;
	position: relative;
	height: auto;
	margin-left: auto;
	margin-right: auto;
}
#con {
	width: var(--con);
	max-width: var(--con_max);
}
#con_page, .con_page {
	width: var(--con_page);
	max-width: var(--con_page_max);
}
#con_smallpage, .con_smallpage {
	width: var(--con_smallpage);
	max-width: var(--con_smallpage_max);
}
#con_content, .con_content {
	width: var(--con_content);
	max-width: var(--con_content_max);
}
#con_small {
	width: var(--con_small);
	max-width: var(--con_small_max);
}
#header_page, #content_page {
	width: 100%;
	height: auto;
	display: block;
	position: relative;
}


/* ------------ INLINE ------------ */
#inline_100, #inline_75, #inline_66, #inline_50, #inline_33, #inline_25, #inline_20, #inline_16  {
	display: inline-block;
	vertical-align: top;
	height: auto;
	position: relative;
}

#inline_100 {
	width: 100%;
	}

#inline_75 {
	width: 75%;
}
#inline_66 {
	width: 66.66%;
}

#inline_50 {
	width: 50%;
	}
#inline_33 {
	width: 33.3%;
	}
#inline_25 {
	width: 25%;
	}
#inline_20 {
	width: 20%;
	}
#inline_16 {
	width: 16.66%;
	}

/* ------------ SETTING CLASS ------------ */

#clear_margin {
	padding: 0px;
	width: 100%;
	height: auto;
	height: auto;
	display: block;
	position: relative;
	}
#full_href {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
}
.center {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}
.block {
	display: block;
}
.opacity05 {
	opacity: 0.5;
}

/* ------------ BG ------------ */
.bg-white {
	background: white;
}
.bg-white-after:after {
	content: '';
	background: white;
	z-index: -2;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

/* ------------ SECTION ROWS ------------ */
section, #section, .section {
	width: 100%;
	height: auto;
	display: block;
	position: relative;
	padding: var(--padding-section);
	}
.row {}
.row.block {
	margin: var(--margin-row_block)
	}
.row.group {
	margin: var(--margin-row_group)
	}
section .row:first-child, #section .row:first-child, .section .row:first-child{
	margin-top: 0px !important;
}
section .row:last-child, #section .row:last-child, .section .row:last-child {
	margin-bottom: 0px !important;
}




/* ------------------------ SHOW THEME ------------------------ */
#show_theme {
	padding: 100px 0px;
	width: 100%;
	height: auto;
	display: block;
	position: relative;
	background: white;
}
#show_theme_element {
	width: calc(100% - 40px);
	box-sizing:border-box;
	height: auto;
	padding: 20px;
	max-width: 1000px;
	margin: auto;
	background: white;
}
#show_theme_element_title {
	width: 100%;
	height: auto;
	font-size: 60px;
	font-weight: var(--weight_bold);
	text-align: left;
	line-height: 70px;
	position: relative;
	color: rgba(0, 0, 0, 0.05);
	margin-bottom: 20px;
}
#show_theme_element_subtitle {
	width: 100%;
	height: auto;
	font-size: 30px;
	font-weight: var(--weight_bold);
	text-align: left;
	line-height: 40px;
	position: relative;
	color: rgba(0, 0, 0, 0.05);
	margin-top: 10px;
}

#show_theme_element_content {
	width: 100%;
	height: auto;
	display: block;
	position: relative;
}



/* ------------------------ WIREFRAME MODE ------------------------ */
body#wireframe {
	background: #D6D6D6;
}

/* ------------ FULL WIDTH ------------ */
#wireframe #header_page,
#wireframe #content_page,
#wireframe #newsletter_full,
#wireframe footer
{
	background: #F3F3F3;
}

/* ------------ COLUMNS ------------ */
#wireframe #inline_66,
#wireframe #inline_33
{
	background:#F7F7F7;
}

/* ------------ BOX-CONTENT ------------ */
#wireframe #post_grid,
#wireframe #post_minigrid,
#wireframe #widget
{
	background: white;
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1);
}


/* ------------ BUTTONS ------------ */
#wireframe #button_b1,
#wireframe #buttons_b2 a,
#wireframe #button_b2,
#wireframe #buttons_b3 a,
#wireframe #button_b3,
#wireframe #buttons_b4 a,
#wireframe #buttons_b5 a,
#wireframe #buttons_b6 a,

#wireframe .page_link,
#wireframe #dots,
#wireframe #prev_page a,
#wireframe #next_page a,

#wireframe .buttons_cat a,
#wireframe #buttons_cat a,
#wireframe .buttons_tag a,
#wireframe #buttons_tag a,

#wireframe button,
#wireframe input[type=button],
#wireframe input[type=reset],
#wireframe input[type=submit],
#wireframe #button-search,
#wireframe #button-subscribe,

#wireframe a#social_link,
#wireframe a#share_link

{
	background: #FCB07E;
	box-shadow: 0px 0px 5px 0px rgba(252,176,126,0.5);
}

/* ------------ PARTS ------------ */
#wireframe #meta_grid,
#wireframe #date_square_content_grid,
#wireframe #social_grid_right_bottom,
#wireframe #share_inline
{
	background: white;
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1);
}


/* ------------------------ FLEX COLS ------------------------ */
#flexs {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items:  stretch;
	box-sizing:border-box;
	position: relative;
}
#flex_col {
	margin: 0;
	padding: 0;
	position: relative;
}
/* ------------ ZAROVNÁNÍ na X (justify-content) ------------ */
.flexs-space-evenly {
	justify-content: space-evenly !important;
}
.flexs-flex-start {
	justify-content: flex-start !important;
}


/* ------------ WIDTH ------------ */
#flexs.col_2 #flex_col {
	width: 50%;
}
#flexs.col_3 #flex_col {
	width: 33.33%;
}
#flexs.col_4 #flex_col {
	width: 25%;
}
#flexs.col_10 #flex_col {
	width: 10%;
}
#flexs.col_4.panel #flex_col {
	width: calc(33.33% - (var(--margin-grid)*2));
	margin: 0 0 calc(var(--margin-grid) * 3) 0;
	padding: var(--padding_y-panel_con) var(--padding_x-panel_con);
	box-sizing:border-box;
}

/* ------------ TYPE ------------ */
#flexs.panel #flex_col {
	box-shadow: var(--shadow);
	background: white;
	border-radius: var(--radius-grid);
}


/* ------------------------ ABSOLUTE ------------------------ */


.panel .absolute-left_bottom {
	position: absolute !important;
	left: var(--padding_x-panel_con);
	bottom: var(--padding_y-panel_con);
}



/* ------------------------ WIDTH ------------------------ */
#square {
	width: 100%;
	padding-top: 100%;
	background: red;
}