.content, .wide,
.narrow, .narrows,
.half, .prejoin,
.overlay .in        { float: left; display: inline-block; text-align: center; position: relative; }

.max                { width: 100%; max-width: 1100px;}
.wide               { width: 100%; }
.content            { width: 100%; min-height: 70%;}
.narrow	            { width: 84%; margin: 0% 8% 0% 8%; }
.narrows			{ width: 70%; margin: 0% 15% 0% 15%; }
.prejoin			{ width: 700px; float: none !important; }
.half               { width: 50%; }

@media all and (max-width: 800px)   { .half     { width: 100%;}}
@media all and (max-width: 1000px)  { .narrow   { width: 96%; margin-left: 2%; margin-right: 2%; }}
@media all and (min-width: 1100px)  { .max      { float: none !important; }}

body        { background: #f1f1f1; text-align: center; }
body * 		{ font-family: regular-open, Arial, sans-serif; color: #111; }

.overlay            { width: 100%; height: 100%; top: 0; left: 0; right: 0; bottom: 0; display: block; position: absolute; }
.overlay .in        { width: 100%; top: 50%; transform: translateY(-50%);}

.mobile.overlay     { position: fixed !important; background-color: rgba(0,0,0,0.9); z-index: 1000000; display: none;}
.mobile .wide       { padding: 5px;}
.mobile .pages      { display: inline-block; width: 200px;}
.mobile .page       { font: 300 16px/16px regular-thin, Arial, sans-serif; text-transform: uppercase; color: #fff; padding: 10px; display: inline-block}


.mtop       { margin-top: 40px;}        .mtop2  { margin-top: 20px;}
.mbtm       { margin-bottom: 40px;}     .mbtm2  { margin-bottom: 20px;}

@media all and (max-width: 600px){
    .mtop   { margin-top: 40px;}        .mtop2  { margin-top: 15px;}
    .mbtm   { margin-bottom: 40px;}     .mbtm2  { margin-bottom: 15px;}
}

.butt 		{ display: inline-block;font: 300 16px/16px semi-open, Arial, sans-serif; text-align: left; color: #fff; background-color: #ff1c1c; border-radius: 2px; padding: 10px 15px; border: 3px solid #d00; text-transform: uppercase; }
.butt:hover	{ background-color: #d00  }

@media all and (max-width: 350px){
    .butt {  padding: 8px 8px; font: 300 12px/12px semi-open, Arial, sans-serif;}
}

.heading 			{ font: 300 20px/20px thin-open, Arial, sans-serif; text-align: left; color: #000; text-transform: uppercase;}
.heading.white 		{ color: #fff; text-align: center;}

.stats span         { font: 300 35px/35px thin-open, Arial, sans-serif; color: #000; text-align: center; text-transform: uppercase;}
.stats span.red     { font: 300 35px/35px semi-open, Arial, sans-serif; color: red;}

@media all and (max-width: 800px){
        .stats span,
        .stats span.red{ font-size: 20px;}}


.header				{ background-color: #000}
.header .logo  		{ float: left; display: inline-block; margin-top: 5px; margin-bottom: 5px;}
.header .logo img 	{ float: left; display: inline-block; height: 40px; width: unset; padding: 10px;}
.header .container 	{ float: right; display: inline-block; }
.header .page 		{ font: 300 16px/30px thin-open, Arial, sans-serif; float: left; text-transform: uppercase; color: #fff; padding: 5px; margin: 5px;}
.header .page:hover { color: #b3b3b3; }
.header .log 		{ margin-left: 40px; font: 300 14px/30px regular-open, Arial, sans-serif;}
.header .join 		{ font: 300 14px/30px regular-open, Arial, sans-serif; background-color: #ff1c1c; border-radius: 2px; padding: 2px 10px; border: 3px solid #d00;}
.header .join:hover { color: #fff; background-color: #d00 }
.header .menu 		{ display: none; height: 20px; margin-top: 15px; margin-left: 5px; cursor: pointer;}
.header .language	{ font: 300 12px/30px thin-open, Arial, sans-serif; float: left; text-transform: lowercase; color: #fff; padding: 5px 10px; margin: 5px 0px; }
.header .language#English,
.header .language#Inglês{ border-right: 1px solid rgba(255,255,255,0.3);}
.header .language:hover     {color: #b3b3b3 }

@media all and (max-width: 530px)   {
    .header .log,
    .header .join,
    .header .language{ display: none; }
    .header .menu { display: inline-block }
}

.home 					{ background-color: #000; }
.home .overlay          { background-color: rgba(0,0,0,0.15);}
.home .overlay h1 		{ font: 300 30px/40px semi-open, Arial, sans-serif; color: #fff; text-align: left;text-shadow: 0px 0px 4px rgba(0, 0, 0, 0.4);}
.home .overlay .butt    { float: left; margin-top: 10px;}
.home .mobile 			{ display: none; }

.view 					{ background-color: #000; }
.view .overlay .title 	{ font: 300 40px/55px semi-open, Arial, sans-serif; color: #000; text-align: center;}
.view .overlay .subtitle{ font: 300 20px/25px semi-open, Arial, sans-serif; color: #000; text-align: center;}

.view .mobile 			{ display: none; }

@media all and (max-width: 700px){
    .view .overlay .title,
    .home .overlay h1 	{ font: 300 25px/30px semi-open, Arial, sans-serif; text-align: center;}
    .view .overlay .subtitle,
    .view .overlay a,
    .home .overlay a 	{ font: 300 16px/16px semi-open, Arial, sans-serif;}
    .home .mobile,
    .view .mobile       { display: block; }
    .home .video,
    .view .video,
    .down               { display: none; }
    .home .overlay .butt{ float: none; }
}

@media all and (max-width: 450px){
    .home .overlay h1 	{ font: 300 18px/20px semi-open, Arial, sans-serif; text-align: center; margin-bottom: 10px;}
    .home .overlay a 	{ font: 300 14px/14px semi-open, Arial, sans-serif; padding: 10px 15px;}
}

.thumb 				{ float: left; display: inline-block; width: 31.3333%; margin: 10px 1%; background-color: #fff; border-radius: 3px; overflow: hidden; -webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.4);-moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.4);box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.4); }
.thumb.top 			{ width: 48% !important; margin: 0px 1%;}

@media all and (max-width: 450px){ .thumb.top { width: 98% !important }}

.thumb .title 		{ font: 300 18px/23px thin-open, Arial, sans-serif; color: #000;  text-align: left;overflow: hidden;text-overflow: ellipsis;white-space: nowrap; }
.thumb .img 		{ border-radius: 3px 3px 0px 0px; overflow: hidden; }
.thumb .overlay > img{  min-height: 100%; float: left; display: inline-block; width: 100%;}
.thumb .meta        { padding: 10px;}
.thumb .dscrp       { font: 300 12px/18px regular-open Arial, sans-serif; color: #959595;  text-align: justify; padding-right: 10px;  margin: 10px 0px; height: 37px; overflow: hidden;}
.thumb .dots 		{ position: absolute; right: 0; bottom: 1px; color: #959595 }
.thumb .link 		{ background-color: #d91212; color: #fff; font: 300 14px/14px thin, Arial, sans-serif; padding: 10px; display: inline-block; margin-top: 10px; border-radius: 3px; text-transform: capitalize;}
.thumb .dark 		{ background-color: rgba(0,0,0,0.05); }
.thumb .img:hover .dark { background-color: rgba(0,0,0,0); }
.thumb .hd          { width: 40px; right: 7px; top: 5px; display: block; position: absolute; }
.thumb .ex          { width: 70px; left: 0px; top: 0px; display: block; position: absolute; }
.thumb .play 		{ display: inline-block; left: 0; right: 0; top: 0; bottom: 0; width: 30px;}
.thumb:hover .play  { width: 35px; opacity: 0.5}
.thumb .images		{ border-radius: 3px; overflow: hidden; margin-bottom: 10px;}
.thumb .images .image 	{ width: 33.333333%; float: left; display: inline-block; position: relative; overflow: hidden}

@media all and (max-width: 810px){ .thumb { width: 48%; }}
@media all and (max-width: 450px){ .thumb { width: 98%; }}

.pagination span 			{ display: inline-block;}
.pagination a				{ color: #333; border: 2px solid rgba(0,0,0,0); display: inline-block; overflow: hidden;  padding: 10px 15px 10px 15px;border-radius: 3px;float: left;width: 100%; height: 100%;font: 300 14px/14px regular, Arial, sans-serif;text-transform: capitalize;}
.pagination a:hover			{ border-color: #d91212;  }
.pagination span.current a 	{ border-color: #ccc; font: 300 14px/14px semi-open, Arial, sans-serif;}

@media all and (max-width: 500px){ .pagination a { padding: 5px 10px 5px 10px; }}

.footer                     { background-color: #000}
.footer .links a            { text-transform: capitalize; color: #acacac; margin: 0 5px; padding: 3px; float: none; display: inline-block; font: 300 11px/11px regular-open, Arial, sans-serif;}
.footer .links a:hover      { text-decoration: underline; }
.footer .bottom span        { font: 300 11px/15px regular-open, Arial, sans-serif; color: #acacac;  display: inline-block;}
.footer .bottom a           { font: 300 11px/15px regular-open, Arial, sans-serif; color: #acacac; text-decoration: underline; }

.meta .heading      { font-size: 30px; line-height: 30px;}
.meta .description  { font: 300 16px/22px regular-open, Arial, sans-serif; color: #444;  text-align: left;}
.meta .down .title  { font: 300 20px/20px thin-open, Arial, sans-serif; color: #000; text-align: center; text-transform: uppercase}
.meta .down a       { display: inline-block; padding: 5px; border-radius: 3px; border: 2px solid #ccc; margin: 0px 5px;}
.meta .down a:hover { border-color: #d91212;}

@media all and (max-width: 500px){
    .meta .heading  { font-size: 20px; line-height: 20px;}
}

.grid .image        { float: left; display: inline-block; width: 23%; position:relative; margin: 10px 1%; border-radius: 3px; overflow: hidden;}

@media all and (max-width: 700px){
    .grid .image    { width: 31%;}
}

@media all and (max-width: 500px){
    .grid .image    { width: 48%;}
}

.legal .narrow *    { margin: 10px 0px; float: left; display: inline-block; width: 100%; }
.legal .title,
.legal .title span  { font: 300 24px/24px thin-open, Arial, sans-serif; color: #000; text-align: left;}
.legal p            { font: 300 16px/22px thin-open, Arial, sans-serif; color: #444;  text-align: left;}
.legal br,
.legal .clear       { display: none !important;}
.legal a            { width: unset !important; margin: 0px 3px !important;}
.legal .title.clear { display: inline-block !important;}

.login 					{ margin-top: 50px; }
.login .heading 		{ text-align: center; }
.login input 			{ border: 1px solid rgba(0,0,0,0.3); padding: 8px; width: 40%; margin-left: 30%; margin-right: 30%; text-align: center;font: 300 16px/20px thin-open, Arial, sans-serif; color: #111; background-color: #fff; border-radius: 2px}
.login .half:last-child { border-left: 1px solid rgba(0,0,0,0.2); }

.login .not .title 		{ font: 300 20px/20px thin-open, Arial, sans-serif; color: #111; text-transform: uppercase; text-align: center;}
.login .not .subtitle	{ font: 300 16px/20px regular-open, Arial, sans-serif; text-align: center; color: #111;}
.login .support a 		{ text-decoration: underline; }

@media all and (max-width: 1150px){
    .login input 			{ width: 60%; margin-left: 20%; margin-right: 20%; }
}

@media all and (max-width: 800px){
    .login .not { display: none; }
    .login .half:last-child { border-left: 0px solid rgba(0,0,0,0.2); }
}

@media all and (max-width: 520px){
    .login input 			{ width: 80%; margin-left: 10%; margin-right: 10%; }
}

.header .language {-webkit-appearance: none; -moz-appearance: none;  appearance: none;}
.header .language option { background-color: #fff; color: #444; font: normal 13px/13px regular, Arial, sans-serif; text-transform: capitalize; clear: both; text-align: left}
.header .language option:hover { background-color: blue; color: #fff;}