/**
################################################################
Theme Name:		Minimaloscope
Theme URI:		http://tf.demo.kiev.ua/demo/minimaloscope/index.html
Author URI:		http://SMSdesign.com.ua/
Version:		1.0.1
	1)MAIN
		1.1)HEADER SECTION
			1.1.1)Logo
			1.1.2)Menu
			1.1.3)Page Description
		1.2)PORTFOLIO SECTION
		1.3)ТЕХТ SECTION
		1.4)FOOTER
	2)ABOUT
		2.1)HEADER SECTION
			2.1.1)Logo
			2.1.2)Menu
			2.1.3)Page Title
			2.1.4)Page Description
		1.2)TEAM SECTION
		1.3)CONTACT SECTION
		1.4)FOOTER
	3)WORKS
		3.1)HEADER SECTION
			3.1.1)Logo
			3.1.2)Menu
			3.1.3)Page Title
			3.1.4)Page Description
		3.2)PORTFOLIO SECTION
		3.3)FOOTER
	4)WORK PAGE
		4.1)HEADER SECTION
			4.1.1)Logo
			4.1.2)Menu
			4.1.3)Page Title
			4.1.4)Page Description
		4.2)WORK SECTION
		4.3)FOOTER
	5)BLOG
		5.1)HEADER SECTION
			5.1.1)Logo
			5.1.2)Menu
			5.1.3)Page Title
			5.1.4)Page Description
		5.2)BLOG LIST SECTION
		5.5)FOOTER
	6)BLOG PAGE
		6.1)HEADER SECTION
			6.1.1)Logo
			6.1.2)Menu
			6.1.3)Page Title
			6.1.4)Page Description
		6.2)BLOG SECTION
		6.3)FOOTER
	7)ABOUT
		7.1)HEADER SECTION
			7.1.1)Logo
			7.1.2)Menu
			7.1.3)Page Title
			7.1.4)Page Description
		7.2)CONTACT SECTION
		7.3)FOOTER


[Color codes]

Background:		#fff	(white)
Content text color:		#a6a6a6 (grey)

a (standard):	#4dc2cb (light blue)
a (active):		#4dc2cb (light blue)

[Typography]

Body:			"Lato", Arial, sans-serif;
Input, textarea: 12px 'Open Sans', sans-serif;

#################################################################
**/
@import url('https://fonts.googleapis.com/css?family=Open+Sans|Montserrat|Lato');
html{
	width:100%;
	padding:0;
	margin:0;

}
body {
	font-family: "Lato", sans-serif;
	font-size: 12pt;
	line-height:2;
	width:100%;
	padding:0;
	margin:0;
	color:#a6a6a6;
}
ul{
	list-style:none;
	padding:0;
	margin:0;
}
img{
	max-width:100%;
}
a{
	color:#4dc2cb;
	transition: all 0.3s;
}
input, a {outline:none;}
/* HEADER  */
header{
	padding-top:85px;	
}
.hamb{
	background:#eee;
}
.hamb span{
	background:#888;
}
.logo{
	display:block;
	float:left;
	width:205px;
	height:165px;
	background:url(../images/logo.png) center center no-repeat;
}
.topmenu{
	padding:10px 0 90px 0;
	margin-bottom:90px;
	max-width:780px;
	background:url(../images/line.png) right bottom no-repeat;
	float:right;
	text-align:right;
}
.topmenu li{
	display:inline-block;
	text-transform:lowercase;
	padding:0 10px;
	font-family: 'Montserrat', sans-serif;
	font-size:14pt;
}
.topmenu li a{
	color:#a6a6a6;
}
.topmenu li.active a, .topmenu li a:hover{
	color:#349fe4;
	text-decoration:none;
}
.titlewrap{
	width:100%;
	justify-content: space-between;
	padding-bottom:85px;
}
.topdescription{
	font-size:24pt;
	line-height:40px;
	color:#a6a6a6;
}
.pagetitle{
	font-size:20pt;
	line-height:40px;
	color:#a6a6a6;
	text-decoration:underline;
	vertical-align: bottom;
	align-self: flex-end;
}
.clear{
	clear:both;
}

/* PORTFOLIO ON MAIN */
.projects li{padding:0;    display: inline-block;
    width: calc( (100% - 40px) / 3);
    margin: 0 0 20px;
    text-align: center;
    vertical-align: top;
    background-color: #4DC2CB;
}
.projects ul li a .title{
	position:absolute;
	left:20px;
	bottom:10px;
	font-size:13px;
	line-height:17px;
	color:#202020;
	background-color:rgba(255,255,255,.8);
	padding:5px 10px;
	opacity:0;
	filter:alpha(opacity=0);
	-webkit-transition:all .3s cubic-bezier(.165,.84,.44,1);
	-moz-transition:all .3s cubic-bezier(.165,.84,.44,1);
	-ms-transition:all .3s cubic-bezier(.165,.84,.44,1);
	-o-transition:all .3s cubic-bezier(.165,.84,.44,1);
	transition:all .3s cubic-bezier(.165,.84,.44,1)
}
.projects ul li a:hover .img-container{
	opacity:.5;
	filter:alpha(opacity=50)
}
.projects ul li a:hover .img-container img{
	-moz-transform:scale(1);
	-o-transform:scale(1);
	-ms-transform:scale(1);
	-webkit-transform:scale(1);
	transform:scale(1)
}
.projects ul li a:hover .title{
	opacity:1;
	filter:alpha(opacity=100);
	bottom:25px
}
.projects ul li .img-container{
	overflow:hidden;
	transition:all .3s ease
}
.projects ul li .img-container img{
	-webkit-transition:all .3s ease;
	-moz-transition:all .3s ease;
	-ms-transition:all .3s ease;
	-o-transition:all .3s ease;
	transition:all .3s ease;
	-moz-transform:scale(1.03);
	-o-transform:scale(1.03);
	-ms-transform:scale(1.03);
	-webkit-transform:scale(1.03);
	transform:scale(1.03);
	display:block
}
.projects ul li a:hover .img-container img {
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    -webkit-transform: scale(1);
    transform: scale(1);
}

/* MAIN */

.flex{
	display:flex;
}
.inner{
	line-height:1.5;
}
.bottomtext p{
	text-align:justify;
	text-align-last: right;
}

/* ABOUT */

.teamlist{
	border-top:1px solid #000;
	border-bottom:1px solid #000;
}
.teamlist .table{
	width:100%;
	display:table;
	margin:40px 0;
}
.teamlist .table>div{
	display:table-cell;
	vertical-align: top;
}
.teamlist .table>div:first-child{
	width:390px;
	padding-right:80px;
}
.teamlist .table>div:last-child{
	width:33%;
}
.teamlist .table>div:nth-child(2){
		padding:0 20px 0 0px;
	}
.teamlist .name, .teamlist .sections{
	color:#000;
}
/* CONTACT FORM */
.writeus{
	padding:65px 0;
	overflow:hidden;
}
.contactform{
	padding:50px 0 0 0;
	border-top:1px solid #000;
	overflow:hidden;
}
.input-wrap input, #message{
	border:none;
	border-bottom:2px solid #000;
	padding:10px 0;
	width:100%;
	margin-bottom: 20px;
	outline:none;
	line-height:1.5;
}
#message{
	height:100px;
}
.input-wrap input::placeholder, #message::placeholder{
	text-transform:uppercase;
}
.send_btn{
	width:100%;
	border:2px solid #000;
	color:#000;
	padding:20px 0;
	text-transform:uppercase;
	background:transparent;
	margin-top:20px;
	transition:all 0.3s ease;
}
.send_btn:hover{
	border-color:#4dc2cb;
	color:#4dc2cb;
}
.notification_error{
	color:#FC8F5F; 
}
.notification_ok{
	font-weight:bold;
	color:#4DC2CB;
	text-align:center;
}
.wtext span{
	color:#000;
}
.wtext{
	padding:0 40px 0 0;
}
.wform{
	padding:0;
}
#map{
	height:555px;
	margin:85px 0 30px 0;
}
/* BLOG */
.blogpage{
	padding:40px 0 0 0;
	margin-bottom:30px;
	border-top:1px solid #000;
	border-bottom:1px solid #000;
}
.blogim{
	padding-bottom:40px;
}
.blogtext{
	padding-bottom:40px;
}
.blogitem{
	padding:25px;
	overflow: hidden;
	border-top:1px solid #C4C4C4;
	line-height:20px;
	display:none;
}
.blogitem div{
	padding:0;
}
.biname{
	color:#000;
}
.bilink{
	font-size:18pt;
	color:#a6a6a6;
}
.blogitem:hover{
	background:#4DC2CB;
	color:#fff;
	border-radius:3px;
}
.blogitem:hover .biname, .blogitem:hover  .bilink{
	color:#fff;
	text-decoration:none;
}
.buttonmore{
	width:100%;
	display:block;
	padding:25px 0;
	border-top:2px solid #4DC2CB;
	border-bottom:2px solid #4DC2CB;
	margin:25px 0;
	text-align:center;
	color:#4DC2CB;
	font-size:18pt;
	cursor:pointer;
}
#showLess{
	display:none;
}
.buttonmore:hover{
	color:#000;
	border-color:#000;
}
.butcontainer{ 
	padding:25px 0;
	border-top:1px solid #C4C4C4;
}
/* BLOG PAGE */
.singlepage{
	line-height:2;
	padding-bottom:50px;
	border-bottom:1px solid #000;
	margin-bottom: 30px;
}
.sblogim{
	padding:40px 0;
}
.sp{
	width:100%;
	justify-content: space-between;
}
.sp .pagecontent{
}
.squote{
	float:left;
	width:60%;
	margin-left:-25%;
	border-left:4px solid #4DC2CB;
	padding:20px 40px 20px 30px;
	color:#4DC2CB;
	font-size:14pt;
}
/* FOOTER */
.bottomtext{
	padding:65px 0 85px 0;
}
footer{
	background:#ececed;
}
.social ul li i:last-child,
.social ul li:hover a i:first-child{
	opacity:0;
	filter:alpha(opacity=0);
}
.social ul li{
	display:inline-block;
	width:25px;
	height:25px;
	overflow:hidden;
	font-size:14px;
	line-height:20px;
	background-color:#000000;
	border-radius:100%;
	margin:0 4px;
	-webkit-transition:all .7s ease;
	-moz-transition:all .7s ease;
	-ms-transition:all .7s ease;
	-o-transition:all .7s ease;
	transition:all .7s ease
}
.social ul li i{transition:all .3s ease}
.social ul li:hover{
	background-color:#4DC2CB
}
.social ul li:hover a{top:-20px}
.social ul li:hover a i:last-child{
	opacity:1;
	filter:alpha(opacity=100)
}
.social ul li a
{
	display:block;
	width:100%;
	height:200%;
	top:3px;
	position:relative;
	transition:all .3s ease;
	text-decoration:none;
	color:#fff;
	text-align:center
}
.social ul li a i:last-child{
	display:block;
	margin-top:6px
}
.social{
	height:25px;
	overflow:hidden;
	text-align:center;
}
.foot{
	height:75px;
	font-family: 'Montserrat', sans-serif;
	font-size:10pt;
	color:#a6a6a6;
}
.foot a{
	color:#a6a6a6;
}
.foot>div{
	flex: 1 1 33%;
	margin:auto;
}
.copy{
	text-align:right;
}
#toTop{
	color:#808080;
	cursor:pointer;
	float:right;
	margin-top:20px;
}
#toTop:hover{
	color:#000;
}
/* WORKS */
.workslist>div{
	padding-bottom:30px;
}
.workslist .workim{
	padding-top:130%;
	overflow:hidden;	
	position:relative;
	background-color: #000;
}
.workslist .workim span{
	display:block;
	position:absolute;
	width:100%;
	top:0;
	bottom:0;
	background-size:cover!important;
	background-position:center center!important;
	opacity:1;
    -webkit-transition: all 2s cubic-bezier(.39,.575,.565,1);
    -moz-transition: all 2s cubic-bezier(.39,.575,.565,1);
    -ms-transition: all 2s cubic-bezier(.39,.575,.565,1);
    -o-transition: all 2s cubic-bezier(.39,.575,.565,1);
    transition: transform 2s cubic-bezier(.39,.575,.565,1), opacity 1.5s ease;
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    -webkit-transform: scale(1);
    transform: scale(1);
}
.workslist a:hover .workim span, .workslist .workim:hover span{
	transform: scale(1.2);
	opacity:0.7;
}
.workslist .col-sm-12 .workim{
	padding-top:40%;
}
.workslist  a:hover{
	text-decoration:none;
}
.workslist  .worktitle:hover{
	text-decoration:underline;
}
.worktitle{
	color:#000;
	padding-top:15px;
}
.workdate{
    color: #a6a6a6;
}
/* SLIDER */
.carousel-inner .item{
	padding-top:45%;
	background-size:cover!important;
	background-position:center center;
}
#fullwidth_slider{
	padding-bottom:75px;
}
#fullwidth_slider .carousel-indicators{
	bottom:25px!important;
	margin-bottom:0;
}
#fullwidth_slider .carousel-indicators li{
	width:15px;
	height:15px;
	border:none;
	background:#4DC2CB;
	transform:rotate(45deg);
	border-radius:0;
	margin:0 6px;
	transition: all 0.3s ;
}
#fullwidth_slider .carousel-indicators li:hover, #fullwidth_slider .carousel-indicators li.active{
	background:#FC8F5F;
}

/* WORK PAGE */
.textcolomn2{
	column-count:2;
	column-gap:50px;
}
.worksoc{
	margin:20px 0;
	color:#999999;
	font-size:11pt;
}
.worksoc ul{
	display:inline-block;
}
.worksoc li{
	display:inline-block;
	padding:0 5px;
}
.worksoc li a{
	color:#999999;
	cursor:pointer;
}
.worksoc li a:hover{
	color:#4DC2CB;
	text-decoration:none;
}
.workslist.morephoto .col-sm-6 .workim{
	padding-top:70%;
}
.workslist.morephoto img{
	display:none;
}
.workslist.morephoto li{
	padding-bottom:30px;
	cursor:pointer;
}
.worktext{
	overflow:hidden;
	padding-bottom:10px;
}
.worktext .worktitle{
	padding:0;
}
.workslist.prevnext .col-sm-6 .workim{
	padding-top:35%;
	text-align:center;
}
.workslist.prevnext a{
	color:#fff;
	position:relative;
	display:block;
	text-align:center;
}
.dtitle{
	color:#000;
	font-size:18pt;
	text-align:center;
	margin-bottom:30px;
}
.mwprev{
    opacity: 0;
    margin-top:-20px;
	font-size:14pt;
    -webkit-transition: all .4s cubic-bezier(.445,.05,.55,.95);
    -moz-transition: all .4s cubic-bezier(.445,.05,.55,.95);
    -ms-transition: all .4s cubic-bezier(.445,.05,.55,.95);
    -o-transition: all .4s cubic-bezier(.445,.05,.55,.95);
    transition: all .4s cubic-bezier(.445,.05,.55,.95);
}
.workslist.prevnext:hover .mwprev{
	opacity:1;
	margin-top:0px;
	
}
.mwtitle{
    margin-top:20px;
	font-size:24pt;
    -webkit-transition: all .4s cubic-bezier(.445,.05,.55,.95);
    -moz-transition: all .4s cubic-bezier(.445,.05,.55,.95);
    -ms-transition: all .4s cubic-bezier(.445,.05,.55,.95);
    -o-transition: all .4s cubic-bezier(.445,.05,.55,.95);
    transition: all .4s cubic-bezier(.445,.05,.55,.95);
}
.workslist.prevnext:hover .mwprev{
	margin-top:0px;
	
}
.pn{
	position:absolute;
	width:100%;
	top:0;
	bottom:0;
}
.pn2{
	margin:auto;
}
/* RESPONSIVE */

@media (min-width: 768px){
	.topmenu, .topdescription, .sp .pagecontent{width:calc(100% - 245px);}
}
@media (min-width: 1200px){
	.topmenu, .topdescription, .sp .pagecontent{width:780px;}
	.container {width: 1210px;}
}
@media only screen and (max-width: 1023px) {
	.teamlist .table{
		display:block;
	}
	.teamlist .table>div{
		display:block;
	}
	.teamlist .table>div:first-child{
		width:50%;
		float:left;
		padding:0;
	}
	.teamlist .table>div:nth-child(2){
		padding:0 0 0 40px;
		width:50%;
		float:left;
	}
	.teamlist .table>div:last-child{
		width:100%;
		clear:both;
		padding-top:20px;
	}
}
@media only screen and (max-width: 767px) {
	.titlewrap{display:block;padding-bottom:25px;}
	.pagetitle div{text-align:center; padding-bottom:20px;}
	header{padding-top:20px;}
	.topmenu .navbar-collapse{padding:0;}
	.topmenu {padding:20px 0; margin-bottom:20px; width:100%; text-align:center;}
	.topmenu li{padding:0 5px;}
	.topdescription{font-size:20pt;}
	.bottomtext{display:block;padding:10px 0 30px 0;}
	.bottomtext div{text-align-last: left; padding:10px 0;}
	.projects {padding-top: 20px;}
	.hamb{margin-top:0;}
	.bilink{margin-top:20px; display:block;	line-height: 1.5;}
	.sp{display:block;}
	.sp .author{padding-bottom:25px;}
	.squote{width:100%; margin:20px 0;}
	#fields{padding-top:20px;}
	.workslist .workim{	padding-top:100%!important;}
	.textcolomn2{column-count:1;}
	.workslist>div{	padding-bottom:15px;}
}
