@font-face {
    font-family: midRegularFont;
    src: url(../fonts/OpenSans-Light.ttf);
    font-weight: normal;
}
@font-face {
    font-family: midRegularFont;
    src: url(../fonts/OpenSans-Bold.ttf);
    font-weight: bold;
}

@font-face {
    font-family: midRegularFont_fallback;
    src: url('https://fonts.googleapis.com/css?family=Open+Sans:300');
}

@font-face {
    font-family: midWaskFont;
    src: url(../fonts/WASK_NEW.OTF);
}

@font-face {
    font-family: midWaskBoldFont;
    src: url(../fonts/WASK_NEW_BOLD.OTF);
}

* {
    margin: 0;
    padding:0;
}

/*::-webkit-scrollbar { 
display: none; 
}
*/

html {
	/*overflow-x: hidden;*/
}

html, body {

    height: 100%;
    background-color: #191919;
    color: #ffffff;
    font-family: midRegularFont, midRegularFont_fallback, CenturyGothic, AppleGothic, sans-serif;
    font-weight: lighter;
    
}

h1, h2, h3, h4{	
	
	font-family: midWaskBoldFont, Futura, sans-serif;
	text-transform: uppercase;
	color: white;		
	letter-spacing: 7px;
}


p { margin: 0px; }


.row {
	margin-left: 0px;
	margin-right: 0px;
	padding-left: 0px;
	padding-right: 0px;
}

.container {
	width: 100%;
	margin-left: 0;
	margin-right: 0;
	padding-right: 0;
	padding-left: 0;
}


.container {
    width: 100%;
  }

.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
    position: relative;
    min-height: 1px;    
}

/* Home */

/* navigation dots */

#dot-nav {    

	position: fixed;
	right: 10px;
	top: 35%;
	margin-top: -50px;
	height: 100px;
	z-index: 999;
}

#dot-nav ul {

	list-style: none;
	margin:0;
	padding: 0;
}
#dot-nav li {

	position: relative;
	background-color: transparent;
	border:2px solid #FFF;
	border-radius: 15px 15px 15px 15px;
	cursor: pointer;
	padding: 5px;
	height: 10px;
	margin: 30px 10px 0px 0px;
	width: 10px;
	vertical-align:bottom;

}
#dot-nav li.active, #dot-nav li:hover {

	background-color: white;
}
#dot-nav a {

	outline: 0;
	vertical-align:top;
	margin: 0px 0px 0px 25px;
	position: relative;
	top:-5px;
}

.hiddenDots {
	display: initial;
}

/* side section tag */
/*.dots-tooltip + .tooltip > .tooltip-inner {

    background-color: rgba(0, 0, 0, 0.5); 
    color: #fff;
}
.dots-tooltip + .tooltip.left > .tooltip-arrow{

    top:50%;
    right: 0;
    margin-top:-5px;
    border-top:5px solid transparent;
    border-bottom:5px solid transparent;
    border-left:5px solid rgba(0, 0, 0, 0.5);
}*/


/* projects */
.project-cont {

	width:100%; 
	padding:0px;
	position: relative;
	background-size: cover;
	min-height: 100vh;
}
.project-caption-titl {

	position: absolute;
  	top: 50%;
  	left: 50%;
  	transform: translate(-50%, -50%);
  	text-align: center;
}
.proj-list-container {
	text-align: left;
}
@media(min-width: 768px) {
	.proj-list-container { 
		padding-left: 4%; 
		margin-bottom: 15vh; 
	}
}
@media(max-width: 767px) {
	.proj-list-container { 
		padding-left: 0%;
		margin-bottom: 25vh; 
	}
}

.vp-player-layout {
	top: 0px !important;
	left: 0px !important;
	height: 100% !important;
	width: inherit !important;
}

.vp-video-wrapper {
	width: inherit !important;
    height: 100% !important;
    position: absolute !important;
    bottom: 0px !important;
}

/*@media(orientation: landscape) {
	.vp-player-layout {
		top: 0px !important;
		left: 0px !important;
		width: 100% !important;
	}

.player.vp-video-wrapper {
	width: 100% !important;
    height: auto !important;
    position: absolute !important;
    bottom: 0px !important;
}*/



/* Project Caption*/

@media(min-width:992px) {

	.project-caption-titl h1 {
	font-size: 5vw;
	letter-spacing: 0.3em;
	}
}

@media(min-width:768px) and (max-width: 991px){

	.project-caption-titl h1 {
	font-size: 7vw;
	letter-spacing: 0.3em;
	}
}
@media(min-width:480px) and (max-width:767px) {
	.project-caption-titl h1 {
	font-size: 10vw;
	letter-spacing: 0.3em;
	}	
}
@media(max-width:479px) {
	.project-caption-titl h1 {
	font-size: 12vw;
	letter-spacing: 0.3em;
	}
}

.project-caption-btn {

	position: absolute;
  	top: 80%;
  	left: 50%;
  	transform: translate(-50%, -50%);
  	text-align: center;
}

/*.viewallprjRow {
	height: 50vh;
}*/

#viewallprj {
	text-align:center;
	margin: 8vw 0px;
}

.carousel-caption h1 {
	text-transform: uppercase;
	font-size: 50px;	
	font-family: midWaskBoldFont;
	letter-spacing: 0.3em;
}


/*COLOR PALETTE*/

.mid-grey {
    color: #191919;
}

.mid-blue {
    color: #0119FF;
}

a {
	color:black;
}

a:hover {
	color: #0119FF;
	text-decoration:none;
}
ul {
    list-style-position: inside;
}

.tagActive {
	color: #0119FF;
	text-decoration:none;
}

.mid-grey-row {
	background-color: #191919;
	color: #ffffff;	
}

.mid-grey-row h1, .mid-grey-row h2, .mid-grey-row h3, .mid-grey-row h4 {
	color: #ffffff;
}

.mid-white-row {
	background-color: #ffffff;
	color: #191919;	
}

.mid-white-row h1, .mid-white-row h2, .mid-white-row h3, .mid-white-row h4 {
	color: #191919;
}

.mid-black-row {
	background-color: #000000;
	color: #ffffff;
}

.mid-black-row h1, .mid-black-row h2, .mid-black-row h3, .mid-black-row h4 {
	color: #ffffff;
}

.mid-black-row a {	
	color: #ffffff;
}

.mid-black-row a:hover {	
	color: #0119FF;
}


/* Blog detailed */

@media(max-width: 767px) {
	.blog-footer { padding-top: 25vh !important; }
}

.blog-footer {

	border-top: 0px;
	margin: 0;
}
.blog-post-title {

	text-transform: uppercase;
	font-size: 70px;
	letter-spacing: 26px;
	font-family: midWaskBoldFont;
}
.blog-post-meta {	

	font-style: italic;
}
.blog-sidebar {

	margin-left: 20px;
	padding-top: 0px;
	margin-top: 0px;	
}

/* Sidebar module */
@media(min-width:1200px) { .blog-sidebar p { font-size: 1vw; } }
@media(min-width:992px) {

	.blog-sidebar {
		text-align: left;
		margin-left: 20px;	
	}
	.blog-sidebar p {
		font-size: 1.2vw;
		margin-bottom: 0px;
	}
	.blog-sidebar h2 {
		font-size: 4vw;
	}
	.blog-sidebar h4 {
		font-size: 1.8vw;
		letter-spacing: 2px !important;
	}
}

@media(min-width:768px) and (max-width: 991px) {

	.blog-sidebar {
		text-align: left;
		margin-left: 20px;	
	}
	.blog-sidebar p {
		font-size: 2vw;
		margin-bottom: 0px;
	}
	.blog-sidebar h2 {
		font-size: 5vw;
	}
	.blog-sidebar h4 {
		font-size: 2.4vw;
		letter-spacing: 2px !important;
	}

}
@media(min-width:480px) and (max-width:767px) {

	.blog-sidebar {
		text-align: center;
		margin-left: 0px;
		margin-top: 10vh;	
	}
	.blog-sidebar p {
		font-size: 2.5vw;
		margin-bottom: 0px;
	}
	.blog-sidebar h2 {
		font-size: 6vw;
	}
	.blog-sidebar h4 {
		font-size: 3.5vw;
	}

}
@media(max-width:479px) {

	.blog-sidebar {
		text-align: center;	
		margin-left: 0px;
		margin-top: 10vh;
	}
	.blog-sidebar p {
		font-size: 4.5vw;
		margin-bottom: 0px;
	}
	.blog-sidebar h2 {
		font-size: 8vw;
	}
	.blog-sidebar h4 {
		font-size: 6vw;
	}

}
.blog-sidebar ol {

	list-style: none;
	text-decoration: none;
}
.sidebar-module {

	padding-top: 0px;
	margin-top: 0px;
	margin-bottom: 35px;
}
.sidebar-module > p { margin-bottom: 0px; }

.nws {

	/*font-family: midWaskFont;*/
	font-family: midRegularFont;
	margin-bottom: 5px;
}
.nws > ol > li > p {

	letter-spacing: 1px; 
	margin: 5px;
}

@media(min-width:1200px) { 

	.nws > p { font-size: 1.4vw; }
	.nws > ol > li > p { font-size: 1.2vw; } 
	.nws > h2 { font-size: 3.2vw !important; }
}
@media(min-width:992px) {

	.nws > p { font-size: 1.4vw; }
	.nws > ol > li > p { font-size: 1.2vw; }
	.nws > h2 { font-size: 2.8vw !important; }
}
@media(min-width:768px) and (max-width:991px) {

	.nws > p {font-size: 2vw;}
	.nws > ol > li > p { font-size: 1.8vw; }
	.nws > h2 { font-size: 3vw !important; }
}
@media(min-width:480px) and (max-width:767px) {

	.nws > p {font-size: 4vw;}
	.nws > ol > li > p { font-size: 4vw; }
	.nws > h2  { font-size: 10vw; }
	.nws > h2 { font-size: 4vw !important; }
}
@media(max-width:479px) {

	.nws > ol > li > p { font-size: 4vw; }
	.nws > h2  { font-size: 12vw; }
	.nws > h2 { font-size: 6vw !important }
}



.newsJump {}
.blog-prev-btn {
	float: left;
	padding-left: 10%;
}
.blog-next-btn {
	float: right;
	padding-right: 10%;
}

/* Blog Main */


@media(min-width:1200px) { 

	.blog-main p, .blog-main li { font-size: 1vw; }
}
@media(min-width:992px) {

	.blog-main {
		padding-right: 80px;
		padding-left: 12vw;
		margin-bottom: 25px;
	}
	.blog-main h2 {
		font-size: 5vw;
		letter-spacing: 0.3em
	}
	.blog-main p, .blog-main li {
		font-size: 1.2vw;
	}
	#blogmain-upspace { padding-top: 100px; }
	.blog-body { padding-bottom: 200px; }
}

@media(min-width:768px) and (max-width: 991px) {	

	.blog-main {
		padding-right: 40px;
		padding-left: 12vw;
		margin-bottom: 20px;
	}
	.blog-main h2 {
		font-size: 6vw;
		letter-spacing: 0.3em
	}
	.blog-main p, .blog-main li {
		font-size: 2vw;
	}
	#blogmain-upspace { padding-top: 100px; }
	.blog-body { padding-bottom: 150px; }	
}
@media(min-width:480px) and (max-width:767px) {	

	.blog-main {
		padding-right: 40px;
		padding-left: 40px;
		margin-bottom: 20px;
	}
	.blog-main h2 {
		font-size: 8vw;
		letter-spacing: 0.3em
	}
	.blog-main p, .blog-main li {
		font-size: 3vw;
	}
	#blogmain-upspace { padding-top: 80px; }
	.blog-body { padding-bottom: 100px; }
}
@media(max-width:479px) {	

	.blog-main {
		padding-right: 20px;
		padding-left: 30px;
		margin-bottom: 15px;
	}
	.blog-main h2 {
		font-size: 10vw;
		letter-spacing: 0.3em
	}
	.blog-main p, .blog-main li {
		font-size: 5vw;
	}
	#blogmain-upspace { padding-top: 50px; }
	.blog-body { padding-bottom: 50px; }
}
/*.blog-main li {

	font-size: 1.2vw;
}*/
.blog-main p > a {

	color: #0119FF;
}
.bolg-entry-date {

	font-size: 34px;
	letter-spacing: 8px;
	font-family: midWaskBoldFont;
}

/* Blog entries list */

@media(min-width: 768px) {
	.blog-list-container { 
		margin-bottom: 15vh; 
	}
}
@media(max-width: 767px) {
	.blog-list-container { 
		margin-bottom: 25vh; 
	}
}

.blog-list {

	display: block;
	padding: 0px 0px;
}

/* version 1 */
/*.blog-list li {

	border:5px solid black;
	padding: 2% 2%;

	text-align:left;

	width: 25vw;
	height: 35vw;
	min-width: 200px; 
	min-height:280px;
	max-height: 35vw;
	
	margin-bottom: 10vh;
	margin-left:  3vw;
	margin-right: 3vw;
	
	text-transform: uppercase;
	font-size: 34px;
	letter-spacing: 6px;
	font-family: midWaskBoldFont;
	word-wrap: break-word;
	text-decoration: none;
}*/

/* version 2 */

@media (min-width: 1280px) {
	.blog-list li {
		border:5px solid black;
		padding-top: 1%;
		padding-right: 2%;
		padding-bottom: 1.5%;
		padding-left: 2%;
		
		width: 240px;
		height: 350px;
		
		margin-bottom: 2vw;
		margin-left:  1vw;
		margin-right: 1vw;

		text-align:left;
		text-align:left;
		text-transform: uppercase;
		font-size: 28px;
		letter-spacing: 4px;
		font-family: midWaskBoldFont;
		word-wrap: break-word;
		text-decoration: none;
	}
}

@media (min-width: 768px) and (max-width: 1279px) {
	.blog-list li {
		border:5px solid black;
		padding-top: 1%;
		padding-right: 2%;
		padding-bottom: 1.5%;
		padding-left: 2%;

		width: 240px;
		height: 350px;
		
		margin-bottom: 2vw;
		margin-left:  1vw;
		margin-right: 1vw;

		text-align:left;
		text-transform: uppercase;
		font-size: 28px;
		letter-spacing: 4px;
		font-family: midWaskBoldFont;
		word-wrap: break-word;
		text-decoration: none;
	}
}
@media (min-width: 480px) and (max-width: 767px) {
	.blog-list li {
		border:5px solid black;
		padding-top: 1%;
		padding-right: 2%;
		padding-bottom: 1.5%;
		padding-left: 2%;

		width: 240px;
		height: 350px;
		
		margin-bottom: 2vw;
		margin-left:  1vw;
		margin-right: 1vw;

		text-align:left;
		text-transform: uppercase;
		font-size: 28px;
		letter-spacing: 4px;
		font-family: midWaskBoldFont;
		word-wrap: break-word;
		text-decoration: none;
	}
}
@media (max-width: 479px) {
	.blog-list li {
		border:5px solid black;
		padding-top: 1%;
		padding-right: 2%;
		padding-bottom: 1.5%;
		padding-left: 2%;

		width: 240px;
		height: 350px;
		
		margin-bottom: 2vw;
		margin-left:  1vw;
		margin-right: 1vw;

		text-align:left;
		text-transform: uppercase;
		font-size: 28px;
		letter-spacing: 4px;
		font-family: midWaskBoldFont;
		word-wrap: break-word;
		text-decoration: none;
	}
}


.blog-list a {

	text-decoration: none;
}

.blogListed {

	position:relative;
 	display: block;
 	margin: 0;
 	width: 100%;
 	height: 100%;
}
.blogListed img {

	max-width: 100%;  
	max-height: 60%;
	position: absolute;
	bottom: 0%;
	left: 50%;
	transform: translate( -50%, 0%); 
}

.blog-list-black{

	background-color:black;
	color:white;
	
}

.blog-list-white{

	background-color:white;
	color:black;
}


@media(min-width: 1280px) {
	.blog-list-black h1 {	

		color:white;
		font-size: 30px;
		text-decoration: none;
		/*transform: translateX(5%);	*/
	}
	.blog-list-black p {

		color:white;
		font-family: midRegularFont;
		font-size: 0.8vw;
		text-decoration: none;
		position: absolute;
    	bottom: 59%;
	}

	.blog-list-white h1 {

		font-size: 30px;
		text-decoration: none;
		/*transform: translateX(5%);*/
	}
	.blog-list-white p {

		color:black;
		font-family: midRegularFont;
		font-size: 0.8vw;
		text-decoration: none;
		position: absolute;
    	bottom: 59%;
	}
}



@media(min-width:768px) and (max-width: 1279px) {

	.blog-list-black h1 {	

		color:white;
		font-size: 30px;
		text-decoration: none;
		/*transform: translateX(5%);	*/
	}
	.blog-list-black p {

		color:white;
		font-family: midRegularFont;
		font-size: 12px;
		text-decoration: none;
		position: absolute;
    	bottom: 62%;
	}

	.blog-list-white h1 {

		font-size: 30px;
		text-decoration: none;
		/*transform: translateX(5%);*/
	}
	.blog-list-white p {

		color:black;
		font-family: midRegularFont;
		font-size: 12px;
		text-decoration: none;
		position: absolute;
    	bottom: 62%;
	}

}
@media(min-width:480px) and (max-width:767px) {

	.blog-list-black h1 {	

		color:white;
		font-size: 30px;
		text-decoration: none;
		/*transform: translateX(5%);	*/
	}
	.blog-list-black p {

		color:white;
		font-family: midRegularFont;
		font-size: 12px;
		text-decoration: none;
		position: absolute;
    	bottom: 63%;
	}

	.blog-list-white h1 {

		font-size: 30px;
		text-decoration: none;
		/*transform: translateX(5%);*/
	}
	.blog-list-white p {

		color:black;
		font-family: midRegularFont;
		font-size: 12px;
		text-decoration: none;
		position: absolute;
    	bottom: 63%;
	}

}
@media(max-width:479px) {

	.blog-list-black h1 {	

		color:white;
		font-size: 30px;
		text-decoration: none;
		/*transform: translateX(5%);	*/
	}
	.blog-list-black p {

		color:white;
		font-family: midRegularFont;
		font-size: 12px;
		text-decoration: none;
		position: absolute;
    	bottom: 65%;
	}

	.blog-list-white h1 {

		font-size: 30px;
		text-decoration: none;
		/*transform: translateX(5%);*/
	}
	.blog-list-white p {

		color:black;
		font-family: midRegularFont;
		font-size: 12px;
		text-decoration: none;
		position: absolute;
    	bottom: 65%;
	}

}

/* The Projects */

/* arrows */
.arrow {

	position: absolute;
	padding: 1rem; /* Arrow size */
	box-shadow: 1px -1px 0 1px white inset;
	-webkit-box-shadow: 2px -2px white inset;
	border: solid transparent;
	border-width: 0 0 2rem 2rem;
	bottom: 1%;
}

@media(min-width:992px) {

	.arrow { left: 48vw; }
}

@media(min-width:768px) and (max-width:991px) {

	.arrow { left: 48vw; }
}
@media(min-width:480px) and (max-width:767px) {

	.arrow { left: 47vw; }
}
@media(max-width:479px) {

	.arrow { left: 45vw; }
}

.arrow-down  
	{transform:rotate(-45deg)}
.arrow-right  
	{transform:rotate(-135deg)}
.arrow-left  
	{transform:rotate(+45deg)}

.arrow_midsides {

	position: absolute;
	padding: 1rem; /* Arrow size */
	box-shadow: 1px -1px 0 1px white inset;
	-webkit-box-shadow: 2px -2px white inset;
	border: solid transparent;
	border-width: 0 0 2rem 2rem;
	left: 50%;
	bottom: 50%;
}

/* tags */
.projtags {

	margin: 30px 0px;
	padding-left: 5vw;
	padding-right: 5vw;
}
.projtags a {

	font-size: 15px;
	letter-spacing: 0.3em;
	padding-right: 15px;
}
.projListed {

 	position:relative;
 	display: block;
 	margin: 5px 0px;
}

.projOverlay {

  display: block;
  position: absolute;
  z-index: 7;
  background: rgba(0, 0, 0, 0.7);
  overflow: hidden;
  transition: all 0.3s;

  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
}
a.projExpand {

  display: inline;
  position: absolute;
  z-index: 8;
  text-align: center;
  color: #fff;
  text-decoration: none;
  left: 50%;
  top:50%;
  transform: translate(-50%, -50%);	
  display:none;
}
.list-inline {

	margin: 0 auto;
}

.sidebar-module > .list-inline>li {

    padding-right: 10px;
    padding-left: 0px;
}

/* Listed projects distribution along screens */
@media(max-width:767px)
	{ .projListed {width: 100%;} }

@media(min-width:768px) and (max-width:991px)
	{ .projListed {width: 45vw;} }

@media(min-width:992px) and (max-width:1199px)
	{.projListed {width: 30vw;}}

@media(min-width:1200px)
	{ .projListed {width: 30vw;} }

.project-list {

	display: block;
  	margin-left: auto;
  	margin-right: auto;
  	margin-top:152px;
	margin-bottom:77px;
}
.project-list li {

	margin-top:15px;
	margin-bottom:15px;	
}
.project-list li:hover {

	background-color:black;
}

hr {

    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid black;
    margin: 1em 0em;
    padding: 0;
    width:96%; 
}
.relatedPrj {

	margin: 10vh 0 0 0;
}
.relatedPrj h2 {

	font-size: 4vw;
}
.relatedList {

	margin-top: 5vh;
}


/* Carousel base class */
.carousel-caption {	
	bottom: 40%;
}
@media(min-width:992px)
	{ .carousel-inner { max-height: 100vh;} }


/* slogan */

.slogan {	
	text-align:center;	
	text-transform: uppercase;
	font-size: 3.5vw;
	letter-spacing: 0.3em;
	font-family: midWaskBoldFont;
}
@media(min-width:768px) {	

	.slogan {
		padding: 140px 100px;
		font-size: 3.5vw;
	}
}
@media(min-width:480px) and (max-width:767px) {	

	.slogan {
		padding: 100px 60px;
		font-size: 6vw;
	}
}
@media(max-width:479px) {	

	.slogan {
		padding: 60px 20px;
		font-size: 8vw;
	}
}


/* extras */

.extras {

	padding-top:120px;
	padding-bottom:120px;	
}
.extras h2 {

	font-size: 4vw;
	letter-spacing: 0.1em;
	font-family: midWaskBoldFont;
}


/* Queries for the distance between list marks and text */

/*@media(min-width:992px){

	.extracont {

		padding-left: 50px;
		padding-right: 50px;
	}
	.extracont li:before {

	    content: "";
	    display: inline-block;
	    width: .5rem;
	    margin-left: -20px; 
	}
}*/

@media(min-width:1200px) { .extras ul { font-size: 1vw; }}
@media(min-width:992px) {

	.extras ul { font-size: 1.1vw; }
}

@media(min-width:768px) and (max-width:991px) {

	.extras ul { font-size: 1.5vw; }

}
@media(min-width:480px) and (max-width:767px) {

	.extras ul { font-size: 2.5vw; }
}
@media(max-width:479px) {

	.extras ul { font-size: 3vw; }
}

/*and (min-width:991px) */
@media(min-width:768px){

	.extracont {
		padding-left: 40px;
		padding-right: 40px;
	}
	.extracont li:before {
	    content: "";
	    display: inline-block;
	    width: .5rem;
	    margin-left: -12px; 
	}
	.extracont li::before {
	    content: "";
	    display: inline-block;
	    width: .5rem;
	    margin-left: -12px; 
	}

}

@media(min-width:480px) and (max-width:767px){ 
	
	.extracont {

		padding-left: 30px;
		padding-right: 30px;
	}
	.extracont li:before {

	    content: "";
	    display: inline-block;
	    width: .5rem;
	    margin-left: -5px; 
	}
	.extracont li::before {

	    content: "";
	    display: inline-block;
	    width: .5rem;
	    margin-left: -1px; 
	}
}
@media(max-width:479px) {

	.extracont {

		padding-left: 10px;
		padding-right: 10px;
	}
	.extracont li:before {

	    content: "";
	    display: inline-block;
	    width: .5rem;
	    margin-left: 0px; 
	}
	.extracont li::before {

	    content: "";
	    display: inline-block;
	    width: .5rem;
	    margin-left: 0px; 
	}
}




@media(min-width:480px) and (max-width:767px){ 	

	.extracont {
		margin-bottom: 40px;
	}
	.extracont h2 {
		text-align: center;
		font-size: 6vw;
	}
	.extras {
		padding-left: 10vw;
		padding-right: 10vw;
	} 
}

@media(max-width:479px) {	

	.extracont {
		margin-bottom: 20px;
	}
	.extracont h2 {
		text-align: center;
		font-size: 8vw;
	}
	.extracont p {
		text-align: center;
		font-size: 8vw;
	}
	.extras {
		padding-left: 15vw;
		padding-right: 15vw;
	} 
}


.extras ul {

	list-style-position: inside;	
}

/* shareon */
.shareon {

	font-size: 20px;
	letter-spacing: 4px;
	font-family: midWaskBoldFont;
	text-align:center;
	color: #626262;	
	padding-top:50px;
	padding-bottom:50px;	
}
.img-responsive-share {

	padding:0;
	margin:0;
	margin:0 auto;	
}


/* social links */
.social-links {

	margin-bottom:10px;
}
.social-links a {

	margin-right:18px;
	margin-left:18px;
}

#FBlogo, #TWlogo, #VMlogo, #FLCKRlogo {
	fill: #F1F1F1;
}

#FBlogo:hover {
	fill: #3b5998 ;
}

#TWlogo:hover {
	fill: #4099FF ;
}

#VMlogo:hover {
	fill: #4EBBFF ;
}

#FLCKRlogo:hover {
	fill: #0063DC ;
}

/* newsletter form */

.newsletter {

	margin-bottom: 20px;
	margin-left:10px;
	text-align:center;	
}

@media(min-width:768px) {

	.form-control {	
		background-color:transparent;
		min-width:380px;
		font-size: 14px;
		color:#ffffff;
		box-shadow: none;
	 	border: none;
	 	outline: none;
	}
}
@media(max-width:767px) {

	.form-control {	
		background-color:transparent;
		min-width:200px;
		font-size: 14px;
		color:#ffffff;
		box-shadow: none;
	 	border: none;
	 	outline: none;
	}
}
#subscriptor, #mce-EMAIL, .form-control {

	border-style: none;
	border-color: transparent;
	box-shadow: none;
 	border: none;
 	outline: none;

}

#mc-embedded-subscribe-form > table > tbody > tr:nth-child(1) > td:nth-child(2) > div.clear {
	height: 10px !important;
}


input:-webkit-autofill {
    /*box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(255, 255, 255, 0.6);*/
    /*-webkit-box-shadow: 0 0 0 50px black inset;    */
    -webkit-text-fill-color: white;
    background-color: black;
    
}

input:-webkit-autofill:focus {
    /*box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(255, 255, 255, 0.6);*/
    /*-webkit-box-shadow: 0 0 0 50px black inset;    */
    -webkit-text-fill-color: white;    
    background-color: black;        
}

/* buttons */

@media(min-width:992px) {

	.btn-default, .btn-default:hover, .btn-default:focus, .btn-default:active:focus {

		background-color:transparent;
		outline: none;
		border-radius: 0;
		border-width: 0.1em;
		padding: 0.8em 1.2em;

		font-family: midWaskFont;
		font-size: 1.5vw;
		font-weight: lighter;
		letter-spacing: 0.3em;

		transition: all 500ms ease;
	}
}
@media(min-width:768px) and (max-width: 991px){

	.btn-default, .btn-default:hover, .btn-default:focus, .btn-default:active:focus {

		background-color:transparent;
		outline: none;
		border-radius: 0;
		border-width: 0.1em;
		padding: 0.9em 1.3em;

		font-family: midWaskFont;
		font-size: 2.2vw;
		font-weight: lighter;
		letter-spacing: 0.3em;

		transition: all 500ms ease;
	}
}

@media(min-width:480px) and (max-width:767px) {

	.btn-default, .btn-default:hover, .btn-default:focus, .btn-default:active:focus {

		background-color:transparent;
		outline: none;
		border-radius: 0;
		border-width: 0.1em;
		padding: 1em 1.4em;

		font-family: midWaskFont;
		font-size: 2.6vw;
		font-weight: lighter;
		letter-spacing: 0.3em;

		transition: all 500ms ease;
	}
}

@media(max-width:479px) {

	.btn-default, .btn-default:hover, .btn-default:focus, .btn-default:active:focus {

		background-color:transparent;
		outline: none;
		border-radius: 0;
		border-width: 0.1em;
		padding: 1.4em 1.8em;

		font-family: midWaskFont;
		font-size: 5vw;
		font-weight: lighter;
		letter-spacing: 0.3em;

		transition: all 500ms ease;
	}
}

#whtbtn {

	color: white;
	border-color: white;
}
#blkbtn {

	color: black;
	border-color: black;
}
#whtbtn.btn-default:hover {

	background-color:white;
	color: black;
	border-color: transparent;
}
#blkbtn.btn-default:hover {

	background-color:black;
	color: white;
	border-color: transparent;
}


/* formulary  */
.form-inline table{
	margin:0 auto;
}
.form-inline table tr td{
	vertical-align:middle;
}
.form-inline button {	
	background-color: transparent;
	background-image:url(../icons/next_2.svg);
	background-repeat:none;
	background-size: 24px 12px;
	border:0;
}
.form-inline button:hover {	
	background-color: transparent;	
}

/* footer menu */
	
@media (min-width: 768) {
	.menu-footer { margin-bottom: 20px; }
}
@media (max-width: 767) {
	.menu-footer { margin-bottom: 10px; }
}

.menu-footer  {
	font-family: midWaskBoldFont;
}
.menu-footer li {
	display: inline;
}
.menu-footer li a {
	text-transform: uppercase;
	color:white;	
	font-size: 19px;
	letter-spacing: 7px;
	text-decoration:none;
	margin-left:15px; margin-right:15px;
}
.menu-footer li a:hover {
	color: #0119FF;
	text-decoration:none;
}

.logo-isotipo-mid {
	margin-bottom: 20px !important;
}

/* modal menu */

.modal-content {

	background-color:black;
	color:#fff;
	text-transform: uppercase;
	font-size: 70px;
	letter-spacing: 26px;
	font-family: midWaskBoldFont;
}

.modal-header {
	background-color:transparent;
	border:0;	
}

.close {
	color:#0119FF;
	opacity:.8;
	text-shadow:none;
}

.close:hover {
	color:#fff;
	opacity:.8;
}

@media(min-width:1200px) {

	#homeMIDlogo.navbar-brand {

	  padding-top: 50px;
	  padding-left: 50px;
	  height: auto;
	  width: 300px;
	}
}
@media(min-width:768px) and (max-width:1199px) {

	#homeMIDlogo.navbar-brand {

	  padding-top: 50px;
	  padding-left: 40px;
	  height: auto;
	  width: 270px;
	}
}
@media(min-width:480px) and (max-width:767px) {

	#homeMIDlogo.navbar-brand {

	  padding-top: 50px;
	  padding-left: 30px;
	  /*margin-top: 4%;*/
	  margin-right: 2%;
	  height: auto;
	  width: 200px;
	}
}
@media(max-width:479px) {

	#homeMIDlogo.navbar-brand {

	  padding-top: 50px;
	  padding-left: 20px;
	  /*margin-top: 8%;*/
	  margin-right: 4%;
	  height: auto;
	  width: 150px;
	}
}


/* menu */

/* The Overlay (background) */
.overlay {
    /* Height & width depends on how you want to reveal the overlay (see JS below) */    
    height: 100%;
    width: 100%;
    position: fixed; /* Stay in place */
    z-index: 9; /* Sit on top */
    left: 0;
    top: 0;
    background-color: rgb(0,0,0); /* Black fallback color */
    background-color: rgba(0,0,0, 0.85); /* Black w/opacity */
    overflow-x: hidden; /* Disable horizontal scroll */
    transition: 0.5s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
    opacity: 0;
    filter: alpha(opacity=0);
    /*filter: alpha(opacity=0);*/
    /*visibility: hidden;*/
    display: none;
}

/* Position the content inside the overlay */
.overlay-content {

    position: relative;
    top: 20%; /* 25% from the top */
    width: 100%; /* 100% width */
    text-align: center; /* Centered text/links */
    margin-top: 25px; /* 30px top margin to avoid conflict with the close button on smaller screens */
    list-style-type: none;
}

.overlay-content ul {

	list-style-position: inside;
	list-style:none;
	list-style-type: none;
}
.social-links a {

	display: inline;
}

/* The navigation links inside the overlay */
.overlay a {
    text-decoration: none;
    font-size: 3.5vw;
    letter-spacing: 0.3em;
    margin-bottom: 0.7vw;
    color: #fff;
    padding: 8px;
    /*Display block instead of inline */
    display: block; 
    transition: 0.3s; /* Transition effects on hover (color) */
}

@media(min-width:768px) and (max-width:991px) {
	.overlay a {font-size: 6vw;}
}

@media(min-width:480px) and (max-width:767px) {
	.overlay a {font-size: 7vw;}
}
@media(max-width:479px) {
	.overlay a {font-size: 8vw;}
}

.overlay p {
	display: block; /* Display block instead of inline */
    transition: 0.3s; /* Transition effects on hover (color) */
}

/* When you mouse over the navigation links, change their color */
.overlay a:hover, .overlay a:focus {
    color:#0119FF;
}

/* The social buttons at the bottom */

footer#menuFooter {

	position: fixed; 
	bottom: 0.5vh;
	text-align: center;
	width:100%;
}
footer#menuFooter a {

	text-align: center;
	display: inline;
	margin: 0px;
	padding: 0px;
}


/* When the height of the screen is less than 450 pixels, change the font-size of the links and position the close button again, so they don't overlap */
@media screen and (max-height: 450px) {
    .overlay a {font-size: 20px}
    }
}

/* mapa */
.container_4_map {
	width: 100%;
  	margin: 0 auto;  	
}
#map_container{
	position: relative;
}

#map {
	height: 0;
    overflow: hidden;
    padding-bottom: 22.25%;    
    position: relative;
}

/*  general */
.no-img-header {
	padding-top:100px;
}

.no-img-header-main {
	margin-top: 40px;
	margin-bottom: 40px;
	padding: 7vw 12vw 3vh 10vw;
	text-align: center;
}


@media(min-width: 1300px) {
	.no-img-header-main h1 {

		font-size: 4vw;
		letter-spacing: 0.3em;
	}
	.no-img-header-main > h2 {

		font-size: 2.5vw;
	}
	.no-img-header-main > p {

		font-size: 1vw;
		padding-right: 20vw;
		padding-left: 20vw;
	}
}

@media(min-width: 992px) and (max-width: 1299px){
	.no-img-header-main h1 {

		font-size: 4vw;
		letter-spacing: 0.3em;
	}
	.no-img-header-main > h2 {

		font-size: 3vw;
	}
	.no-img-header-main > p {

		font-size: 1.2vw;
		padding-right: 15vw;
		padding-left: 15vw;
	}
}
@media(min-width: 768px) and (max-width: 991px){

	.no-img-header-main h1 {

		font-size: 5vw;
		letter-spacing: 0.3em;
	}
	.no-img-header-main > h2 {

		font-size: 3.5vw;
	}
	.no-img-header-main > p {

		font-size: 1.5vw;
		padding-right: 10vw;
		padding-left: 10vw;
	}
}
@media(min-width:480px) and (max-width:767px) {

	.no-img-header-main h1 {

		font-size: 6vw;
		letter-spacing: 0.3em;
	}
	.no-img-header-main > h2 {

		font-size: 4.5vw;
	}
	.no-img-header-main > p {
		
		font-size: 2vw;
		padding-right: 8vw;
		padding-left: 8vw;
	}

}
@media(max-width:479px) {

	.no-img-header-main h1 {

		font-size: 10vw;
		letter-spacing: 0.3em;
	}
	.no-img-header-main > h2 {

		font-size: 6vw;
	}
	.no-img-header-main > p {
		
		font-size: 4vw;
		padding-right: 2vw;
		padding-left: 2vw;
	}

}



#mailTolink:hover {
    color: #D8D8D8;
}


@media(max-width:767px){
	a#menuburg{
	  top: 50px;
	  right: 50px;
	  padding-top: 0%;
	  padding-right: 4%;
	  width: 20px;
	  height: 20px;
	}	
}

@media(min-width:768px){
	a#menuburg{
	  top: 50px;
	  right: 50px;
	  padding-top: 0%;
	  padding-right: 4%;
	  width: 20px;
	  height: 20px;
	}
}



#nav-icon2 {
  width: 60px;
  height: 45px;
  position: absolute;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
}

#nav-icon2 span {
  display: block;
  position: absolute;
  height: 5px;
  width: 35%;
  background: white;
  opacity: 1;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

#nav-icon2 span:nth-child(even) {
  left: 45%;
  border-radius: 0;
}

#nav-icon2 span:nth-child(odd) {
  left:15%;
  border-radius: 0;
}

#nav-icon2 span:nth-child(1), #nav-icon2 span:nth-child(2) {
  top: 5px;
}

#nav-icon2 span:nth-child(3), #nav-icon2 span:nth-child(4) {
  top: 18px;
}

#nav-icon2 span:nth-child(5), #nav-icon2 span:nth-child(6) {
  top: 31px;
}

#nav-icon2.open span:nth-child(1),#nav-icon2.open span:nth-child(6) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

#nav-icon2.open span:nth-child(2),#nav-icon2.open span:nth-child(5) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

#nav-icon2.open span:nth-child(1) {
  left: 9px;
  top: 11px;
}

#nav-icon2.open span:nth-child(2) {
  left: calc(50% - 9px);
  top: 11px;
}

#nav-icon2.open span:nth-child(3) {
  left: -50%;
  opacity: 0;
}

#nav-icon2.open span:nth-child(4) {
  left: 100%;
  opacity: 0;
}

#nav-icon2.open span:nth-child(5) {
  left: 9px;
  top: 24px;
}

#nav-icon2.open span:nth-child(6) {
  left: calc(50% - 9px);
  top: 24px;
}
