
@font-face {
	font-family: 'SourceSansPro-Bold';
	src:	url('/css/fonts/SourceSansPro-Bold.eot?#iefix') format('embedded-opentype'),
		url('/css/fonts/SourceSansPro-Bold.woff') format('woff'),
		url('/css/fonts/SourceSansPro-Bold.ttf')  format('truetype'),
		url('/css/fonts/SourceSansPro-Bold.svg#SourceSansPro-Bold') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'SourceSansPro-Light';
	src:	url('/css/fonts/SourceSansPro-Light.eot?#iefix') format('embedded-opentype'),
		url('/css/fonts/SourceSansPro-Light.woff') format('woff'),
		url('/css/fonts/SourceSansPro-Light.ttf')  format('truetype'),
		url('/css/fonts/SourceSansPro-Light.svg#SourceSansPro-Light') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'SourceSansPro-Regular';
	src:	url('/css/fonts/SourceSansPro-Regular.eot?#iefix') format('embedded-opentype'),
		url('/css/fonts/SourceSansPro-Regular.woff') format('woff'),
		url('/css/fonts/SourceSansPro-Regular.ttf')  format('truetype'),
		url('/css/fonts/SourceSansPro-Regular.svg#SourceSansPro-Regular') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'SourceSansPro-Semibold';
	src:	url('/css/fonts/SourceSansPro-Semibold.eot?#iefix') format('embedded-opentype'),
		url('/css/fonts/SourceSansPro-Semibold.woff') format('woff'),
		url('/css/fonts/SourceSansPro-Semibold.ttf')  format('truetype'),
		url('/css/fonts/SourceSansPro-Semibold.svg#SourceSansPro-Semibold') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'FuturaPT_Light';
	src: url('/css/fonts/FuturaPT-Light.eot?#iefix') format('embedded-opentype'),
	url('/css/fonts/FuturaPT-Light.otf')  format('opentype'),
	url('/css/fonts/FuturaPT-Light.woff') format('woff'),
	url('/css/fonts/FuturaPT-Light.ttf')  format('truetype'),
	url('/css/fonts/FuturaPT-Light.svg#FuturaPT-Light') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'FuturaPT_Heavy';
	src: url('/css/fonts/FuturaPT-Heavy.eot?#iefix') format('embedded-opentype'),
	url('/css/fonts/FuturaPT-Heavy.otf')  format('opentype'),
	url('/css/fonts/FuturaPT-Heavy.woff') format('woff'),
	url('/css/fonts/FuturaPT-Heavy.ttf')  format('truetype'),
	url('/css/fonts/FuturaPT-Heavy.svg#FuturaPT-Heavy') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
    font-family: 'FuturaPT_Book';
    src: url('/css/fonts/FuturaPT-Book.eot');
    src: url('/css/fonts/FuturaPT-Book.eot?#iefix') format('embedded-opentype'),
    url('/css/fonts/FuturaPT-Book.woff') format('woff'),
    url('/css/fonts/FuturaPT-Book.ttf') format('truetype'),
    url('/css/fonts/FuturaPT-Book.svg#FuturaPT-Book') format('svg');
    font-weight: normal;
    font-style: normal;
}
/* ================================================== */


.container {
	max-width: 1200px;
	width: 100%;
	margin: auto;
	position: relative;
}

body {
	background-color: #f2f2f2;
	background-image: url("./images/background.jpg");
	font-size: 16px;
	color: #404040;
	font-family: "SourceSansPro-Regular";
}

a {
	color: inherit;
	text-decoration: inherit;
}

.text_left {
	text-align: left;
}

.text_center {
	text-align: center;
}

.text_right {
	text-align: right;
}

.button {
	background-color: #ccb3c0;
	color: white;
	font-family: "SourceSansPro-Bold";
	line-height: 38px;
	padding: 0 32px;
	display: inline-block;
	font-size: 1.125em;
	border-radius: 10px;
}

textarea {
	border: 2px solid #cdd4d9;
	border-radius: 4px;
	padding: 10px 22px;
	font-size: 1.125em;
	font-family: "SourceSansPro-Regular";
}

strong{
	font-weight: bold !important;
}

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

#header {
	background-color: white;
	height: 124px;
	margin-bottom: 46px;
	position: relative;
	text-align: center;
}

#logo {
	position: absolute;
	left: 0; top: 0; bottom: 0;
	margin: auto;
	height: 50px;
	width: 406px;
}

#header .menu {
	line-height: 124px;
	text-align: right;
}

.container.menu{
	display: inline-block;
	margin: 0 auto;
}

.menu .item {
	font-family: "SourceSansPro-Bold";
	margin-left: 16px;
	color: #acacac;
}

.menu .item.active {
	color: #404040;
}

.menu .item.social {
	width: 30px;
	height: 30px;
	border-radius: 100%;
	background-color: white;
	border: 1px solid #acacac;
	fill: #acacac;
	display: inline-block;
	position: relative;
}
#header_menu_table{
	font-family: 'FuturaPT_Light';
	width: auto;
	font-size: 16px;
	text-align: justify;
	float: right;
}
#header_menu_table:after{
	content: "";
	display: inline-block;
	width: 100%;
}

#header_menu_table a{
	font-size: 16px;
	text-decoration: none;
}
#header_menu_table a:hover{
}
.header_cell{
	display: inline-block;
	position: relative;
}
.header_cell+.header_cell{
	padding-left: 25px;
}
.header_cell a+a{
	padding-left: 10px;
}

.down{
	position: relative;
	top: -1px;
	fill: #acacac;
}
#dropdown_block{
	position: absolute;
	z-index: 100;
	min-width: 335px;
	padding-bottom: 5px;
	padding-top: 7px;
	right: -30px;
	top: 95%;
	height: 100%;
	background-color: #ffffff;
}
.hide_menu{
	display: none;
}
.menu_display{
	display: table;
}
.hidden_element+.hidden_element{
}
.hidden_element{
	font-size: 16px;
	line-height: 24px;
	display: block;
	padding: 10px 35px 11px 35px;
	color: #747576;
}
.hidden_element:last-child{
	padding-bottom: 10px;
	padding-left: 35px;
}
.header_cell:hover #dropdown_block{
  display: table;
}
#dropdown_block .hidden_element:hover{
	background-color: #f1f0f0;
	color: black;
}
#cat:hover div#dropdown_block{
  display: table;
}
.share_block {
	position: relative;
}
.soc{
	position: relative;
	display: inline-block;
	vertical-align: middle;
}
.share_block svg{
	width: 30px;
	height: 30px;
}

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

#posts > .item {
	background-color: white;
	overflow: hidden;
	margin-bottom: 46px;
	position: relative;
}

.container > .title{
    font-size: 1.438em;
    padding-bottom: 36px;
    text-align: center;
    font-family: "FuturaPT_Heavy";
    text-transform: uppercase;
}

#posts > .item .contents {
	overflow: hidden;
	display: flex;
	align-items: center;
	height: 288px;
}
#posts > .item .contents div {
	margin-left: 20px;
}

#posts > .item .title {
	font-size: 1.125em;
	text-transform: uppercase;
	font-family: 'FuturaPT_Heavy';
}

#posts > .item .description:not(:empty) {
	font-size: 18px;
	padding-top: 36px;
	line-height: 24px;
	padding-right: 40px;
    font-family: 'FuturaPT_Book';
}

#posts > .item .image {
	width: 462px;
	height: 288px;
	background-color: #f8e3ee;
	background-size: cover;
	background-position: center;
	float: left;
}

#posts > .item .more {
	color: #80a37e;
	font-size: 1.063em;
}

#posts > .item .more:before {
	content: " ";
}

#posts > .item .attributes {
	position: absolute;
	right: 0; bottom: 20px;
    font-family: 'FuturaPT_Light';
}

#posts > .item .attributes > .item {
	padding-right: 18px;
}

#posts > .item .attributes > .item svg {
	width: 22px;
	height: 14px;
	position: relative;
	bottom: -2px;
}

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

#pagination {
	background-color: white;
	padding: 34px 0;
	text-align: center;
}

#pagination .item {
	overflow: hidden;
	display: inline-block;
	line-height: 28px;
	height: 30px;
	width: 30px;
	border-radius: 100%;
	border: 1px solid white;
	font-family: "SourceSansPro-Bold";
	font-size: 0.875em;
	cursor: pointer;
}

#pagination .item.active {
	background-color: #ccb3c0;
	border-color: #ccb3c0;
}

#pagination .control {
	border-color: #ccb3c0;
	font-size: 18px;
	line-height: 27px;
	overflow: hidden;
}

#pagination .control:hover {
	background-color: #ccb3c0;
}

#pagination .control i {
	position: relative;
	top: -1px;
	letter-spacing: -1px;
}

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

#post {
	background-color: white;
	margin-bottom: 70px;
	position: relative;
}

#post > .contents {
	padding: 26px 30px;
}

#post > .contents > .image {
	height: 295px;
	width: 856px;
	margin: auto;
	background-size: cover;
	background-position: center;
}

#post > .contents > .title {
	font-size: 23px;
	padding: 36px 0;
	text-align: center;
	font-family: 'FuturaPT_Heavy';
	text-transform: uppercase;
	position: relative;
}

#post .share {
	background-color: #ccb3c0;
	line-height: 40px;
	display: inline-block;
	position: absolute;
	float: left;
	left: 0;
	top: 26px;
	height: 40px;
	bottom: 0px;
	margin-bottom: 20px
}

#post .share .title {
	color: white;
	text-transform: uppercase;
	font-size: 0.875em;
	padding: 0 24px;
}

#post .share .contents {
	display: inline-block;
	position: relative;
	top: 4px;
}

.share .item {
	display: inline-block;
	fill: white;
	padding-right: 8px;
}

.share .item svg {
	height: 20px;
	width: 20px;
}

#post .description {
	font-size: 18px;
	line-height: 24px;
    font-family: 'FuturaPT_Book';
}

#post .description img{
	width: 80%;
	height: auto;
	margin: 35px 10% 35px 10%;
}

#post .description p+p{
	padding-top: 30px;
}

#post .description p+ul{
	padding-top: 30px;
}

#post .description ul+p{
	padding-top: 30px;
}

#post .description ul li{
	padding-left: 20px;
	position: relative;
}

#post .description ul li:before{
	vertical-align: bottom;
    content: '\2022';
    position: absolute;
    left: 0;
}

#social .title {
    font-family: 'FuturaPT_Book';
	font-size: 16px;
	padding-left: 32px;
	padding-bottom: 24px;
	font-weight: 700;
}

#social {
	overflow: hidden;
	padding-bottom: 40px;
}

#social .comments {
	background-color: white;
	padding-bottom: 38px;
	height: 128px;
}

#comments {
	padding-bottom: 42px;
}

.comments {
	margin-bottom: 46px;
}

#comments .comments:last-child {
	margin-bottom: 0;
}

.comments .photo, #user_image {
	background-color: #f8e3ee;
	height: 80px;
	width: 80px;
	border-radius: 100%;
	float: left;
	margin: 24px 26px;
	overflow: hidden;
}

.comments .photo div {
	height: 100%;
	width: 100%;
	background-size: cover;
}

.comments .right {
	padding: 24px 0;
	font-family: 'FuturaPT_Book';
}

.comments .right h3 {
	padding-bottom: 4px;
	font-family: 'FuturaPT_Heavy';
}

.comments .date {
	display: none;
}

#authorize {
	background-color: white;
	display: inline-block;
	clear: both;
}

#authorize .contents {
	padding: 14px 22px;
}

#authorize .item {
	line-height: 34px;
	display: inline-block;
	margin-right: 24px;
	padding-left: 44px;
	padding-right: 12px;
	color: white;
	fill: white;
	position: relative;
	cursor: pointer;
}

#authorize .item svg {
	width: 20px;
	height: 18px;
	position: absolute;
	left: 12px; top: 0; bottom: 0;
	margin: auto;
}

/**/

.fb {
	background-color: #41748f;
}

.tw {
	background-color: #5aa0c1;
}

.dr {
	background-color: #d68e22;
}

.gp {
	background-color: #b64c3c;
}

/**/

#make_comment .left {
	max-width: 140px;
	text-align: center;
	float: left;
}

#user_image {
	background-size: cover;
	float: none;
}

#user_name {
	font-family: "SourceSansPro-Bold";
	display: block;
}

#make_comment .right {
	padding-top: 20px;
}

#make_comment textarea {
	width: 868px;
	height: 110px;
}

#make_comment .controls {
	width: 868px;
	overflow: hidden;
	padding-top: 20px;
}

#footer {
	height: 75px;
	background-color: #ffffff;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}

#footer strong{
	font-family: 'FuturaPT_Heavy';
}

#footer .menu {
	padding-bottom: 8px;
}

#footer .menu .item {
	color: #404040;
	margin: 0;
	font-family: 'FuturaPT_Light';
}

#footer .menu .item:after {
	content: " | ";
}

#footer .menu .item:last-child:after {
	content: "";
}

@media(max-width: 1024px){
	#posts > .item{
		display: block;
		position: relative;
		height: 100%;
	}
	#posts > .item .contents > div{
		display: block;
		position: relative;
	}
	#posts > .item .title{
		text-align: center;
		padding-top: 40px;
	}
	#posts > .item .contents{
		display: block;
   		height: 100%;
   		width: 100%;
   		vertical-align: middle;

	}
	#post > .contents > .image {
		min-width: 250px;
		width: 100%;
		height: 250px;
	}
	#posts > .item .image {
	    width: 100%;
	    height: 350px;
	    background-color: #f8e3ee;
	    background-size: cover;
	    background-position: center;
	    float: left;
	    margin-right: 20px;
	}
	#posts > .item .attributes{
		display: block;
		position: static;
		width: 100%;
	    padding: 7% 7% 7% 7%;
	}
	#posts > .item .attributes > .item {
	    display: block;
	    padding: 10px 0 10px 0;
	}
	#posts > .item .description:not(:empty) {
	    width: 100%;
	    padding-left: 6%;
	    padding-right: 6%;
	    display: block;
	}
	section.container{
		
    padding-left: 5%;
    padding-right: 5%;
	}
}


@media(max-width: 815px){

	body{
		min-width: 320px;
		padding-left: 0;
		width: 100%;
	}
	#header {
		max-width: 768px;
	    height: 154px;
	    width: 100%;
	    padding-left: 0;
	    padding-right: 5%;
	    margin-right: 0;
	}
	#logo {
		position: relative;
		left: 0; top: 20px; bottom: 0;
		margin: 0;
		height: 50px;
		width: 95%;
		display: inline-block;
	}
	section.container{
		max-width: 768px;
		width: 100%;
		padding-left: 5%;
		padding-right: 5%;
		margin: auto;
		position: relative;
	}
	#header_menu_table{
		width: 100%;
	}
	.header_cell:first-child{
		display: none;
	}
	.header_cell:last-child{
		padding-left: 25px;
	}
	#category_cell{
		padding-left: 0px;

	}
	#cat_but{
		padding-left: 20px;
	}
	#dropdown_block {
	    width: 100vw;
	    right: auto;
	    top: 100px;
	}
	.header_cell a+a{
		padding-left: 5px;
	}
	.active_lang{
		display: none;
	}
	.hidden_element:last-child {
		padding: 10px 35px 10px 35px;
	}
	#posts > .item{
		display: block;
		position: relative;
		height: 100%;
	}
	#posts > .item .contents > div{
		display: block;
		position: relative;
	}
	#posts > .item .title{
		text-align: center;
		padding-top: 40px;
	}
	#posts > .item .contents{
		display: block;
   		height: 100%;
   		width: 100%;
   		vertical-align: middle;

	}
	#post > .contents > .image {
		min-width: 250px;
		width: 100%;
		height: 200px;
	}
	#post .share {
	    background-color: #ccb3c0;
	    line-height: 40px;
	    position: static;
	    text-align: center;
	    margin-top: 0;
	    margin-bottom: 35px;
	    width: 100%;
	}
	#posts > .item .image {
	    width: 100%;
	    height: 210px;
	    background-color: #f8e3ee;
	    background-size: cover;
	    background-position: center;
	    float: left;
	    margin-right: 20px;
	}
	#posts > .item .attributes{
		display: block;
		position: static;
		width: 100%;
	    padding: 7% 7% 7% 7%;
	}
	#posts > .item .attributes > .item {
	    display: block;
	    padding: 10px 0 10px 0;
	}
	#posts > .item .description:not(:empty) {
	    width: 100%;
	    padding-left: 6%;
	    padding-right: 6%;
	    display: block;
	}
	.page{
		width: 100%;
		padding: 0 0 0 0%;
		margin: 0;
	}
	#authorize {
	    width: 100%;
	}
	#authorize .contents {
	    width: 100%;
	}
	#authorize .item {
	    line-height: 34px;
	    display: block;
	    width: 100%;
	}
	#social .comments {
	    background-color: white;
	    padding-bottom: 0px;
	    margin-bottom: 20px;
	    min-height: 120px;
	    height: 100%;
	}
	.comments .photo, #user_image {
	    background-color: #f8e3ee;
	    height: 80px;
	    width: 80px;
	    border-radius: 100%;
	    float: left;
	    margin: 12px 13px;
	    overflow: hidden;
	}
	.comments .right {
	    padding-right: 24px;
	    padding-bottom: 15px;
	}
	#make_comment .left {
	    max-width: 100%;
	    width: 100%;
	    text-align: center;
	    float: left;
	}
	#social .title {
	    padding-left: 0;
	}
	.left #user_image {
	    background-color: #f8e3ee;
	    height: 80px;
	    width: 80px;
	    border-radius: 100%;
	    float: initial;
	    margin: 24px 26px;
	    overflow: hidden;
	}
	#make_comment textarea {
	    width: 90%;
	    margin-left: 5%;
	    margin-top: 5%;
	    height: 110px;
	}
	#make_comment .controls {
	    width: 100%;
	    overflow: hidden;
	    padding-top: 20px;
	    text-align: center;
	}
	.centered{
		width: 86%;
		padding-left: 7%;
	}
	#footer{
		padding: 0 5%;
	}
}
@media(max-width:767px){

	#post > .contents > .image {
		min-width: 250px;
		width: 100%;
		height: 150px;
	}
}