@font-face {
    font-family: 'bryant_probold';
    src: url('../fonts/bold-webfont.eot');
    src: url('../fonts/bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/bold-webfont.woff2') format('woff2'),
         url('../fonts/bold-webfont.woff') format('woff'),
         url('../fonts/bold-webfont.ttf') format('truetype'),
         url('../fonts/bold-webfont.svg#bryant_probold') format('svg');
    font-weight: normal;
    font-style: normal;

}


b, strong{
	font-family: 'bryant_probold';
}

html{
	overflow-x: hidden;
	background-color: black;
}
body{
	overflow-x: hidden;
	font-family: 'Varela Round', sans-serif;
}
p a{
	color: white;
	text-decoration: underline;
}
div.ng-binding img{
	width: auto;
	height: auto;
	max-width: 100%;
}

.fix_topo{
	position: absolute;
  width: 100%;
  left: 0;
  bottom: 0;
}
.grid-stack-item-content.pub.topo{
	background: none !important;
}
.grid-stack-item-content.pub.topo img{
	width: 100%;
}

a:focus {
	text-decoration: none;
}

.fundo{
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background-image:url('static/img/fundo4.jpg');
	background-size: cover;
	background-position: center;
	overflow: hidden;
}
.fundo.noite{
	background-image:url('static/img/fundo2.jpg');
}

.menu_bar{
	width: 100%;
	height: 60px;
	background-color: rgba(0,0,0,0.5);
	position: fixed;
	text-align: center;
	line-height: 60px;
	top: 0;
	left: 0;
	z-index: 98;
}
.menu_btn{
	width: 60px;
	height: 60px;
	background-color: #f8c900;
	text-align: center;
	line-height: 60px;
	position: fixed;
	top: 0;
	left: 0;
}
.logo_mobile{
	height: 45px;
  	margin-left: 21%;
}
.menu_btn img{
	width: 30px;
	height: 30px;
}
ul.navigation{
	transition: .2s all linear;
	position: fixed;
	top: 0;
	left: 0;
	list-style: none;
	width: 85px;
	height: 100%;
	overflow: auto;
	background-color: rgba(0,0,0,0.5);
	padding: 0;
	padding-left: 5px;
	padding-right: 5px;
	z-index: 100;
}
ul.navigation li a{
	float: left;
	width: 100%;
	height: 100px;
	border-bottom: solid 1px rgba(255,255,255,0.2);
	color: white;
	text-align: center;
	overflow: hidden;
	font-size: 0.8em;
	-webkit-transition: .2s all linear;
	-moz-transition: .2s all linear;
	-o-transition: .2s all linear;
	transition: .2s all linear;
}
ul.navigation li a:hover{
	background-color: #f8ca00;
	text-decoration: none;
}
.icone_menu{
	width: 60px;
	height: 60px;
	margin-top: 0px;
	padding: 12px;
	padding-bottom: 0;
}

.logomenu{
	width: 60px;
	height: 60px;
	padding: 0;
}
.link_home{
	margin-top: 20px;
	padding: 0;
	height: 80px !important;
}
.link_home:hover{
	background-color: transparent !important;
}
.site-wrap{
	width: 90%;
    position: absolute;
    top: 0;
    left: 85px;
    z-index: 1;
}
.nav-trigger {
    position: absolute;
    background-color: #f8c900;
    cursor: pointer;
    width: 60px;
	height: 60px;
   	background-image: url(../img/icones/menu.svg);
    background-size: 40px 40px;
    background-repeat: no-repeat;
    background-position: center;
    z-index: 99;
    z-index: 999;
    top:0;
}
.logo_desktop{
	width: 80%;
	height: 110px;
}

/* dropdown */
ul.dropdown{
	list-style: none;
	float: right;
	margin-top: 20px;
	position: relative;
	z-index: 99;
}

ul.dropdown li{
	width: 50px;
	height: 50px;
	background-color: red;
	text-align: center;
	line-height: 50px;
	color: white;
	background-color: #107ec8;
}
ul.dropdown li a{
	text-transform: uppercase;
	text-decoration: none;
	color: white;
	cursor: pointer;
}


.grid-stack {

        }

        .grid-stack-item-content {
        	color: white;
            text-align: center;
            background-color: black;
            overflow: hidden !important;
            cursor: pointer;
        }

        .grid-stack .grid-stack {
            /*margin: 0 -10px;*/
            background: rgba(255, 255, 255, 0.3);
        }

.ilha1{
	background-color: rgba(248,201,0,0.75);
}
.ilha2{
	background-color: rgba(149,193,31,0.75);
}
.ilha3{
	background-color: rgba(149,27,129,0.75);
}
.ilha4{
	background-color: rgba(127,81,34,0.75);
}
.ilha5{
	background-color: rgba(125,125,125,0.75);
}
.ilha6{
	background-color: rgba(16,126,200,0.75);
}
.ilha7{
	background-color: rgba(255,255,255,0.45);
	color: #107ec8;
}
.ilha9{
	background-color: rgba(230,0,126,0.75);
}
.ilha8{
	background-color: rgba(0,0,0,0.75);
}
.legenda{
	width: 100%;
	height: 50px;
	line-height: 50px;
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 3;
	font-size: 1.3em;
}
.videohome .legenda{
	color: white;
}
.overlay{
	width: 100%;
	height: 50px;
	position: absolute;
	bottom: 0px;
	left: 0;
	background-repeat: no-repeat;
	background-size: 150px;
	background-position: center;
	transition: all 0.5s ease;
}
.overlayquieto{
	width: 100%;
	height: 50px;
	position: absolute;
	bottom: 0px;
	left: 0;
	background-color: rgb(149,193,31);
}

.grid-stack-item-content:hover .overlay{
	height: 100%;
	background-image: url(../img/icones/olho.png);
	background-repeat: no-repeat;
	background-size: 150px;
	background-position: center;
}

.grid-stack-item-content.videohome:hover .overlay{
	height: 100%;
	background-image: url(../img/icones/play.png);
	background-repeat: no-repeat;
	background-size: 150px;
	background-position: center;
}


.grid-stack-item-content:hover .nmode .overlay{
	height: 100%;
	background-image: url(../img/icones/timelapse.svg);
	background-repeat: no-repeat;
	background-size: 80px;
	background-position: center;
}

.ui-resizable-se{
	color: rgba(255,255,255,0.75) !important;
}


/*facebook widget*/
.facebook_widget{
	width: 100%;
	height: 100%;
	background-color: blue;
	overflow: hidden;
}
.user{
	width: 20%;
	height: 20%;
	background-color: red;
	float: left;
}
.user img{
	width: 100%;
}
.overlay_facebook{
	background-color: rgba(59,89,152,0.8);
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background-image: url(../img/icones/facebook.svg);
	background-size: 100px;
	background-repeat: no-repeat;
	background-position: center;
	transition: all 0.5s ease;
}

.like{
	background-color: rgba(59,89,152,1);
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 100%;
	background-image: url(../img/icones/like.svg);
	background-size: 100px;
	background-repeat: no-repeat;
	background-position: center;
	z-index: 3;
	transition: all 0.5s ease;
}

.facebook_widget:hover .overlay_facebook{
	left: -100%;
}
.facebook_widget:hover .like{
	left: 0;
}

.fb-like{
    width: 94px !important;
}



.event_list_container{
	background-color: rgba(0,0,0,0.75) !important;
	overflow: hidden;
}

.event_list_container header{
	width: 100%;
	height: 50px;
	background-color: #107ec8;
	position: absolute;
	top: 0;
	left: 0;
	padding: 0px;
	z-index: 4;
}

.event_list_container header h1{
	margin: 0;
	line-height: 50px;
	font-size: 1.8em;
}

.event_slide{
	width: 100%;
	height: 100%;
	float: left;
	padding: 10px;
	padding-top: 60px;
	border-right: 1px dashed rgba(255,255,255,0.5);
	position: relative;
	text-align: center;
}
.owl-carousel .owl-item{
	height: 100%;
}
.owl-carousel,.owl-wrapper, .owl-wrapper-outer{
	height: 100%;
}
.owl-wrapper-outer{
	overflow: visible;
}

.event_photo{
	width: 100%;
	height: 35%;
	/*background-image: url(../img/event.jpg);*/
	background-size: cover;
	background-position: center;
}

.event_slide h3{
	text-align: left;
	font-size: 1.1em;
}
.event_slide h4{
	text-align: left;
	margin: 0;
	font-size: 0.8em;
	color: #107ec8;
}

.event_slide a.more{
	color: white;
	text-decoration: none;
	position: absolute;
	bottom: 0;
	left:0;
    right:0;
    margin-left:auto;
    margin-right:auto;
	width: 80%;
	/*height: 60px;*/
	background-color: #107ec8;
	border: none;
	font-size: 2em;
	transition: .2s all linear;
}
.event_slide a#more:hover{
	background-color: #f8ca00;
}



.next{
	width: 100px;
	height: 100px;
	background-color: #f8ca00;
	position: absolute;
	right: -75px;
	top: 50%;
	margin-top: -25px;
	z-index: 4;
	font-size: 3em;
	line-height: 100px;
	transition: all 0.5s ease-out;
	text-align: center;
	cursor: pointer;
}
.next:hover{right: 0;}

.prev{
	width: 100px;
	height: 100px;
	background-color: #f8ca00;
	position: absolute;
	left: -75px;
	top: 50%;
	margin-top: -25px;
	z-index: 4;
	font-size: 3em;
	line-height: 100px;
	transition: all 0.5s ease-out;
	text-align: center;
	cursor: pointer;
}
.prev:hover{left: 0;}

/*ILHAS*/
.ilha_container,.item_container{
	height: 50px;
	overflow: hidden;
	position: relative;
	text-align: center;
	color: white;
	cursor: pointer;
	margin-top: 20px;
	transition: all 0.3s ease;
}
.item_cont{
	background-size: cover;
	overflow: hidden;
	position: relative;
	text-align: center;
	color: white;
	cursor: pointer;
	margin-top: 20px
}


.video_container{
	background-color: black;
	height: 50px;
	overflow: hidden;
	position: relative;
	text-align: center;
	color: white;
	cursor: pointer;
	margin-top: 20px;
	transition: all 0.3s ease;
}

.video_container.live{
	height: auto;
	padding: 0px;
	margin-top: 0px;
}

.video_container.live .video{
	height: auto;
	padding-bottom: 40px;

}
.live_spacer{
	padding: 10px;
}
.vid_aovivo_wrap{
	width: 100%;
	height: 100%;
}

.vid_aovivo{
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center;
}
.vid_aovivo .on_now{
	color: white;
}
.vid_aovivo .title_live{
	background-color: rgb(149,193,31);
	color: white;
	height: 50px;
	line-height: 50px;
	position: absolute;
	width: 100%;
	bottom: 0;
}

.embeb_wrapper{
	width: 100%;
	height: 100%;
	background-color: black;
}



.solive{
	padding: 5px;
}
.wrap_live{
	margin-bottom: 10px;
	overflow: auto;
}
.wrap_live h1{
  color: #107dc7;
  font-size: 4em;
  margin-left: 5px;
 }
span.on_now{
  position: absolute;
  font-size: 0.8em;
  background-color: #a61600;
  border-radius: 9px;
  padding: 4px 8px;
  top: 8px;
  right: 8px;
}
.dados_vid{
	background-color: rgba(21,102,156,0.7);
	padding: 4px 8px;
	overflow: auto;
}

.dados_vid.related{
background-color: rgba(21,102,156,0.7);
  padding: 4px 8px;
  overflow: auto;
  position: absolute;
  width: 100%;
  z-index: 99999;
  height: 25px;
  bottom: 0;
}

.dados_vid span.vid_views{
	float: right;
	color: white;
	font-size: 0.8em;
}

.dados_vid span.vid_date{
	float: left;
	color: white;
	font-size: 0.8em;
}

.btn_ordvid{
	width: 50%;
	padding: 8px 0px;
	background-color: #0e4eac;
	color: white;
	border:0;
	float: left;
	outline:none;
}
.btn_ordvid:hover{
	background-color: #107ec8;
}

.btn_ordvid.active{
	background-color: #107ec8;
}

.videohome_container{
	background-color: black;
	overflow: hidden;
	position: relative;
	text-align: center;
	color: white;
	cursor: pointer;
	margin-top: 20px;
	transition: all 0.3s ease;
}
.row.listavideos{
	padding-bottom: 40px;
}
.video_container.big{
	padding-top: 0px;
	height:400px;
}
.video_container.live a .overlay{
	background-color: rgb(149,193,31);;
}

.item_container:hover .overlay{
	height: 100%;
	background-image: url(../img/icones/olho.png);
	background-repeat: no-repeat;
	background-size: 150px;
	background-position: center;
}

.ilha_container:hover .overlay{
	height: 100%;
	background-repeat: no-repeat;
	background-image: url(../img/icones/plus.png);
	background-size: 80px;
	background-position: center;
}
.video_container:hover .overlay{
	height: 100%;
	background-repeat: no-repeat;
	background-image: url(../img/icones/play.png);
	background-size: 100px;
	background-position: center;
	z-index: 99;
}
.videohome_container:hover .overlay{
	height: 100%;
	background-repeat: no-repeat;
	background-image: url(../img/icones/play.png);
	background-size: 100px;
	background-position: center;
	z-index: 99;
}
.videohome_container:hover .overlay{
	height: 100%;
	background-repeat: no-repeat;
	background-image: url(../img/icones/play.png);
	background-size: 100px;
	background-position: center;
	z-index: 99;
}



.video_container.big:hover .overlay{
	height: 50px;
	background-repeat: no-repeat;
	background-image: none;
	background-size: 100px;
	background-position: center;
	z-index: 1;
}

ul.dropdown_ilhas{
	list-style: none;
	padding: 0;
	position: relative;
	height: 90px;
	overflow: visible;
	z-index: 99;
}
ul.first{
	z-index: 101;
}


ul.dropdown_ilhas li{
	width: 100%;
	height: 60px;
	background-color: #107ec8;
	text-align: center;
	line-height: 60px;
	color: white;
	cursor: pointer;
}
ul.dropdown_ilhas li:hover{
	background-color: #4098d3;
}

ul.dropdown_ilhas .selected,ul.dropdown_ilhas .selected:hover{
	color: #107ec8;
	background-color: white;
	position: relative;
}

ul.dropdown_ilhas .selected span{
	position: absolute;
	top: 50%;
	margin-top: -8px;
	right: 20px;
	-ms-transform: rotate(90deg); /* IE 9 */
    -webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */
    transform: rotate(90deg);
}

.event .overlay, .video_container .overlay , .videohome .overlay {
  background-color: #107ec8;
}
.slider_event{
	width: 100%;
	height: auto;
	background-color: black;
	overflow: hidden;
	position: relative;
	color: white;
}

.slider_event .event{
	width: 100%;
	height: 100%;
	position: relative;
}

.slider_event .next, .slider_event .prev{
	margin-top: -50px !important;
}

.descricao{
  position: absolute;
  top: 50%;
  right: 0;
  text-align: right;
}
.event_descricao {
  position: absolute;
  top: 36%;
  right: 0;
  text-align: right;
}
h1.nome_event{
	padding: 20px;
	background-color: #107ec8;
	margin-bottom: 0;
}
h2.data_local{
	padding: 20px;
	background-color: #f8ca00;
	font-size: 1.5em;
	float: right;
	margin-top: 0;
}
.event_descricao h1.nome_event{
	padding: 10px;
	font-size: 1.5em;
}
.event_descricao  h2.data_local{
	padding: 5px;
	font-size: 0.9em;
}


.legenda{
    font-size: 1em;
    height: 50px;
    line-height: 1.2em;
    display: table;
    padding: 0 !important;
    text-align: center;
}

.legenda .text_leng{
    display: table-cell;
    height: 50px;
    width: 100%;
    vertical-align: middle;
    text-align: center !important;
}

.event .overlay{
	background-color: #107ec8;
}

.event .overlay .legenda .text_leng{
	color: white;
}
.add_event{
	background-color: #107ec8;
	text-transform: uppercase;
	position: relative;
	overflow: hidden;
	transition: all 0.5s ease;
}

.plus{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 3;
	background-repeat: no-repeat;
	background-image: url(../img/icones/plus.png);
	background-size: 100px;
	background-position: center;
	transition: all 0.5s ease;
}

.add_event:hover{
	background-color: #f8ca00;
}

.add_event:hover .plus{
	-webkit-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	-o-transform: rotate(180deg);
	transform: rotate(180deg);
}

/*Evento*/
.event_photo_xl{
	width: 100%;
	height: 500px;
	background-color: red;
	background-size: cover;
	background-position: center;
}

.bigcam{
	width: 100%;
	height: auto;
	position: relative;
	background: black;
}
.bigcam.nobg{
	background: none;
}
.bigcam img{
	width: 100%;
	height: auto;
}
.switch{
	top: 0px;
	left: 0px;
}

.cam{
	position: relative;
}

.event_info,.cam_info{
	width: 100%;
	padding: 50px 20px 10px 20px;
	background-color: #107ec8;
	color: white;
}

.cam_info{
	background-color: rgba(0,0,0,0.5);
	position: relative;
}

.event_map{
	width: 100%;
	height: 500px;
	background-color: red;
	background-image: url(../img/map.jpg);
	background-size: cover;
	background-position: center;
}

.pub{
	width: 100%;
	background-color: black;
	margin-bottom: 20px;
}

.cam_meteo{
	color: white;
	text-align: center;
	overflow: hidden;
}
.cam_meteo img{
	/*height: 100px;*/
	width: 80%;
	padding: 5px;
}

.row.mares{
	margin-top: 10px;
	background-color: rgba(0,0,0,0.2);
	padding: 10px 0px;
	margin-bottom: 8px;
}
.row.mares .cam_meteo img{
	height: 40px;
	width: auto;
}
.row.mares .cam_meteo p{
	margin: 0;
	padding: 0;
	line-height: 40px;
}

.acordeon{
	margin-top: 20px;
}


.open,.closed{
	width: 100%;
	padding: 20px;
	color: white;
}

.open{
	background-color: #107ec8;
}

.closed{
	background-color: #0e4eac;
	/*border-top: 1px solid rgba(0,0,0,0.1);*/
}

.cmn-toggle {
  position: absolute;
  margin-left: -9999px;
  visibility: hidden;
}
.cmn-toggle + label {
  display: block;
  position: relative;
  cursor: pointer;
  outline: none;
  user-select: none;
}

input.cmn-toggle-yes-no + label {
  padding: 2px;
  width: 50px;
  height: 50px;
}
input.cmn-toggle-yes-no + label:before,
input.cmn-toggle-yes-no + label:after {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  color: #fff;
  font-family: "Roboto Slab", serif;
  font-size: 20px;
  text-align: center;
  line-height: 60px;
}
input.cmn-toggle-yes-no + label:before {
  background-color: #f8ca00;
  content: attr(data-off);
  transition: transform 0.5s;
  backface-visibility: hidden;
  background-image: url(../img/icones/frame.svg);
  background-size: 25px;
  background-repeat: no-repeat;
  background-position: center;
}
input.cmn-toggle-yes-no + label:after {
  background-color: #107ec8;
  content: attr(data-on);
  transition: transform 0.5s;
  transform: rotateY(180deg);
  backface-visibility: hidden;
  background-image: url(../img/icones/webcam.svg);
  background-size: 25px;
  background-repeat: no-repeat;
  background-position: center;
}
input.cmn-toggle-yes-no:checked + label:before {
  transform: rotateY(180deg);
}
input.cmn-toggle-yes-no:checked + label:after {
  transform: rotateY(0);
}

.partilhar{
	position: absolute;
	bottom: 20px;
	right: 20px;
	background-color: rgba(59,89,152,1);
	background-image: url(../img/icones/facebook.svg);
	background-size: 40px;
	background-position: left;
	background-repeat: no-repeat;
	height: 40px;
	line-height: 40px;
	width: 160px;
	text-align: center;
	z-index: 10;
	color: white;
	cursor: pointer;
}

.partilhar.cam22, .partilhar.cam24, .partilhar.cam32, .partilhar.cam37, .partilhar.cam46, .partilhar.cam52, .partilhar.cam31, .partilhar.cam26, .partilhar.cam34, .partilhar.cam35, .partilhar.cam38, .partilhar.cam28, .partilhar.cam30{
	left: 20px;
}

.partilhar.topo{
	top: 20px;
	right: 20px;
}
/*Streaming*/

.search{
	width: 100%;
	height: 60px;
	background-color: rgba(0,0,0,0.5);
	line-height: 60px;
	color: white;
	padding-left: 50px;
	border: none;
}

.search_icon{
	position: absolute;
	height: 30px;
	top: 50%;
	margin-top: -15px;
	left: 25px;
}


.video{
	width: 100%;
	height: 400px;
	background-color: grey;
	float: left;
}


/*footer*/
.gridfooter{
	display: table;
}
.footer-container{
	display: table-cell;
	padding: 20px;
	padding-bottom: 0px;
	background-color: rgba(0,0,0,0.5);
	color: white;
	vertical-align: middle;
	text-align: center;
}

ul.footer{
	list-style: none;
	padding: none !important;
	padding-left: 0px !important;
}

ul.footer li{
	display: inline-block;
	/*line-height: 80px;*/
}

ul.footer li img{
	height: 80px;
}

/*acrescimos*/
.switch{
	float: left;
}

/*toggle2*/
input.cmn-toggle-yes-no-2 + label {
  padding: 2px;
  width: 50px;
  height: 50px;
}
input.cmn-toggle-yes-no-2 + label:before,
input.cmn-toggle-yes-no-2 + label:after {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  color: #fff;
  font-family: "Roboto Slab", serif;
  font-size: 20px;
  text-align: center;
  line-height: 60px;
}
input.cmn-toggle-yes-no-2 + label:before {
  background-color: #107ec8;
  content: attr(data-off);
  transition: transform 0.5s;
  backface-visibility: hidden;
  background-image: url(../img/icones/timelapse.svg);
  background-size: 25px;
  background-repeat: no-repeat;
  background-position: center;
}
input.cmn-toggle-yes-no-2 + label:after {
  background-color: #f8ca00;
  content: attr(data-on);
  transition: transform 0.5s;
  transform: rotateY(180deg);
  backface-visibility: hidden;
  background-image: url(../img/icones/close.svg);
  background-size: 25px;
  background-repeat: no-repeat;
  background-position: center;
}
input.cmn-toggle-yes-no-2:checked + label:before {
  transform: rotateY(180deg);
}
input.cmn-toggle-yes-no-2:checked + label:after {
  transform: rotateY(0);
}

/*caixa restaurantes*/
.restaurante_container{
	padding: 10px;
}
.col-md-12.restaurante{
	background: white;
	overflow: auto;
	padding: 1.5%;
}
.restaurante{
	background: white;
	overflow: auto;
	padding: 3%;
}

.restaurante_container h1{
	color: #107ec8;
	font-size: 1.5em;
	width: 100%;
	margin: 3%;
}

.col-md-12.restaurante_container h1{
	margin: 0 0 10px 0;
}


.col-md-12.foto_restaurante{
	width: 100%;

	margin-bottom: 1.5%;
}

.foto_restaurante{
	width: 100%;
	margin-bottom: 3%;
	height: 200px;
	background-size: cover;
}
.ondedesc{
	text-align: justify;
}
.comer_wrap{
	/*height: 260px;*/
	margin-bottom: 30px;
}

.descricao_restaurante{
	color: #535353;
	padding: 0;
}

ul.info_adicional{
	padding-left: 0px;
}
ul.info_adicional li{
	list-style: none;
	color: #107ec8;
	padding: 8px 0px;
	border-bottom: 1px solid #ccc;
	overflow: auto;
}
ul.info_adicional li span{
	display: block;
	width: 94%;
	float: right;
}

/*estilo bandeiras*/
.bandeira{
	border: none !important;
}

.vermelha{background-color: #ff3d00;}
.amarela{background-color: #f8c900}
.verde{background-color: #388e3c;}
.azul{background-color: #337ab7;}
.xadrez{
	 text-shadow:
   -1px -1px 0 #000,
    1px -1px 0 #000,
    -1px 1px 0 #000,
     1px 1px 0 #000;
}

.form_container{
	background-color: white;
	padding: 20px;
	margin-left: 20px;
	width: 50%;
	margin-bottom: 35px;
}

.form_container h1{
	color: #107ec8;
}

.spot_button{
	background-color: #107dc7;
	border: none;
	color: white;
	padding: 10px 20px 10px 20px;
	transition: .2s all linear;
}
.spot_button:hover{
	background-color: #f8c900;
}


.textdiv{
	background-color: white;
	padding: 20px;
	float: left;
}

.btn_voltar{
	line-height: 50px;
	color: white;
	width: auto;
	width: 200px;
	text-align: center;
	text-transform: uppercase;
	margin-bottom: 20px;
	cursor: pointer;
}

.barra_pub{
	width: 300px;
	position: absolute;
	top: 20px;
	right: 15px;
}

.barra_pub.lateral.lower{
	top: 290px;
}

.container_cpub{
	width: 100% !important;
	padding-right: 335px !important;
	padding-left: 25px !important;
	min-height: 1460px;
	padding-bottom: 40px;
}

.gurubutton {
  cursor: pointer;
  position: absolute;
  right: 10px;
  margin-top: -34px;
  margin-right: 20px;
  background: #107ec8;
  padding: 2px 7px;
  border-radius: 0px;
  color: white;
  text-decoration: none;
  padding: 5px 10px 5px 10px;
  text-transform: uppercase;
  transition: .2s all linear;
}

.gurubutton:hover{
	background-color: #f8c900;
	color: black;
}

.item_cont.acordeao{
	height: 250px;
}

.panel-group .panel{
	border-bottom: solid 1px rgba(255,255,255,0.1);
	cursor: pointer;
}

.panel-group .panel:hover{
	background-color: #107ec8;
}

.panel-group .panel.true {
  background-color: #107ec8 !important;
}

.lateral .info_praia_col h4{
	margin-top: 30px;
}

.titulo{
	color: #107dc7;
	font-size: 4em;
	margin-left: 25px;
}


.info_praia_line{
	height: 50px;
	line-height: 50px;
	border-bottom: 1px dotted white;
}

.info_praia_line .span_info{
	font-size: 1em;
	float: left;
	text-align: left;
	padding: 0;
}

.info_praia_line span{
	float: right;
	text-align: right;
}

.info_praia_line .bandeira{
	height: 20px;
	width: 20px;
	margin-top: 15px;
	border-radius: 50%;
	margin-right: 10px;
	float: left;
}

.lateral .info_praias h1{
	color: #f8bf00;
	margin:0;
}

span#close{
	color: white;
	background: #f8bf00;
	font-size: 30px;
	padding: 3px 12px;
	margin-top: 10px;
	position: absolute;
	top: 5px;
	right: 10px;
	cursor: pointer;
	transition: all 0.5s ease;
}

span#close:hover{
	background-color: #107dc7;
}

.info_praias.paradesktop{
	padding: 20px 20px 10px 20px;
}

.footer a{
	color: #107dc7;
}

ul.footer li{
	font-size: 0.8em;
	color: lightgrey;
}


.headroom {
    transition: transform 200ms linear;
}
.headroom--pinned {
    transform: translateY(0%);
}
.headroom--unpinned {
    transform: translateY(-100%);
}



.barra_extra{
    height: 50px;
    padding-left: 15px;
    padding-right: 15px;
    position: relative;
    margin-top: 15px;
    margin-bottom: 15px;
    position: relative;
}

.barra_extra .partilhar{
    position: absolute;
    top: 0;
    left: 10px;
    height: 50px;
    line-height: 50px;
    background-size: 50px;
    width: calc(100% - 70px);
}

.barra_extra .switches{
    position: absolute;
    right: 10px;
    top: 0;
    width:50px;
    height: 50px;
    overflow: hidden;
    background-color: rgba(59,89,152,1);
}

.barra_extra .switch{

}

/* CAM INFO MOBILE */

.cam_info.mobile{
    padding: 20px;
    font-size: 0.9em;
}

.cam_info.mobile .row{
    border-bottom: 1px dotted white;
    line-height: 50px;
}

.cam_info.mobile .row .valor{
    text-align: right;
}

.cam_info.mobile img{
    height: 30px;
}

.pop_wrapper{
    text-align: center;
    padding: 20px;
    font-family: 'Varela Round', sans-serif;
}

.pop_wrapper h1{
    color: #107ec8;
}





.event_info.video_des{
    padding: 20px;
}

.event_info.video_des .row{
    margin-right: 0;
    margin-left: 0;
    margin-top: 20px;
}

.event_info.video_des h1{
    margin-top: 10px;
}

.extra_video{
    background-color: #f8bf00;
    widows: 100%;
    height: 100%;
    padding: 20px;
}

.partilhar_mobile {
    width: 100%;
    height: 50px;
    background-color: red;
}
.partilhar_mobile .partilhar{
    position: relative;
    height: 50px;
    width: 100%;
    background-size: 50px;
    line-height: 50px;
    top: 0;
    left: 0;
}

#ngProgress {
    background-color: #f8ca00 !important;
    color: #f8ca00;

}

.overlay.live_event{
    background-color: rgb(149,193,31);
}





.vid_aovivo_wrap a{
    color: white;
}

.vid_aovivo_wrap a:hover{
    color: white;
}

.icone_tipo{
    position: absolute;
    width: 35px;
    height: 35px;
    top: 10px;
    left: 10px;
    background-color: rgba(0,0,0,0.8);
    border-radius: 50%;
    line-height: 35px;
    text-align: center;
    /* opacity: 0.75; */
}

.icone_tipo img{
    width: 22px !important;
}

div.event.acordeao .overlay, div.event.onde .overlay{
    background-color: #07306c;
}















/*------- MEDIA QUERIES -------*/
@media(max-width:991px){

	.ui-resizable-handle {
		display: none !important;
	}
	.contact_container{
		width: 100%;
		margin: 0;
	}
	.container_cpub{
		width: 100% !important;
		padding-right: 20px !important;
		padding-left: 20px !important;
		min-height: 400px !important;
	}
	.barra_pub{
		display: none;
	}
	.footer-container{
		display: block;
		width: 100%;
		padding-left: 20px;
	}
	.nothome .foot_wrap{
		padding: 0px 8px 0px 10px;
  		margin: 0;
	}



    .overlay{
        height: 50px;
    }
    .grid-stack-item-content:hover .overlay{
        height: 50px !important;
        background-image:none !important;
    }

    .grid-stack-item-content:hover .nmode .overlay{
        height: 50px !important;
        background-image:none !important;
    }

    .item_container:hover .overlay{
        height: 50px !important;
        background-image:none !important;
    }
    .ilha_container:hover .overlay{
        height: 50px !important;
        background-image:none !important;
    }
    .video_container:hover .overlay{
        height: 50px !important;
        background-image:none !important;
    }

    .video_container.big:hover .overlay{
        height: 50px !important;
        background-image:none !important;
    }




} /* fim IPAD */






/* Small devices (tablets, 768px and up) */
@media(max-width:767px){

	.dropdown.langs.mobile{
		position: relative;
		margin: 0;
		padding: 0;
  	}

  	ul.dropdown.langs.mobile li{
  		width: 50px;
  		height: 60px;
  		line-height: 60px;
  	}


	.ngdialog.ngdialog-theme-default .ngdialog-close:before {
		font-size: 2.5em;
		top: 0.2em;
		right: 0.2em;
	}
	.ilhade2 img, .ilhade3 img, .ilhade6 img{
		height: 100%;
		width: auto;
	}

	.video_container.live .video {
		padding-bottom: 30px;
	}
	.col-xs-12.solive{
		padding: 0;
	}

	.ngdialog.ngdialog-theme-default.bigpop .ngdialog-content{
	    width: 614px;
	}

	h1.titulo{
		font-size: 2em;
	}
	.wifihere {
	  margin-top: -8px;
	}
	.wifihere img {

	  margin-top: 6px;

	}

	.ui-resizable-handle {
		display: none !important;
	}
	ul.navigation li a{
	font-size: 1em;
	}
	.site-wrap{
		left: 0;
		width: 100% !important;
		padding-right:0px;
	}
	.grid-stack{
		margin-top: 100px;
	}
	.container-fluid{
		padding-top: 150px;
	}
	.container-fluid, .col-md-12{
		margin-left: 0;
		padding-left: 10px;
		padding-right: 10px;
	}

	.grid-stack-animate{
		margin-top: 0px;
	}
	.view.ng-scope{
		margin-top: -70px;
	}

    .legenda{
        font-size: 0.9em;
        height: 35px;
        line-height: 1em;
        display: table !important;
        padding: 0 !important;
        text-align: center;
    }

    .legenda .text_leng{
        display: table-cell;
        height: 35px;
        width: 100%;
        vertical-align: middle;
        text-align: center !important;
    }

	.footer-container{
		display: block;
		width: 100%;
		padding-left: 20px;
	}

	.padd{
	    padding-left: 20px !important;
	    padding-right: 20px !important;

	}
	ul.footer li img{
		width: 90px;
		height: auto;
	}



.overlay{
	height: 35px;
}
.grid-stack-item-content:hover .overlay{
	height: 35px !important;
	background-image:none !important;
}

.grid-stack-item-content:hover .nmode .overlay{
	height: 35px !important;
	background-image:none !important;
}

.item_container:hover .overlay{
	height: 35px !important;
	background-image:none !important;
}
.ilha_container:hover .overlay{
	height: 35px !important;
	background-image:none !important;
}
.video_container:hover .overlay{
	height: 35px !important;
	background-image:none !important;
}

.video_container.big:hover .overlay{
	height: 35px !important;
	background-image:none !important;
}

.lastupdate{
	text-align: center;
}

.info_praia_col{
	float: left;
	height: 150px;
}

.textdiv{
	padding-left: 20px;
}

.contact_container{
	width: 100%;
	margin: 0;
	margin-bottom: 35px !important;
	float: left;
}

.container_cpub{
	width: 100% !important;
	padding-right: 20px !important;
	padding-left: 20px !important;
}

.col-xs-6, .col-xs-12{
	padding-left: 10px;
	padding-right: 10px;
}

.row{
	margin-left: -10px;
	margin-right: -10px;
}

.btn_voltar{
	width: 120px;
	height: auto;
	line-height: 35px !important;
}

.info_praias{
	padding-top: 20px;
}

.meteo_mobile{
	padding-top: 20px;
}

.accord_mapa{
	padding: 0 !important
}

.accord_mapa .panel-heading, .accord_mapa .panel-body{
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.container_cpub.eventos{
	padding-right: 10px !important;
  	padding-left: 10px !important;
}

.event_info{
	padding-top: 20px;
}

.searchdiv{
	margin-bottom: 20px;
}

.container-fluid.contactos{
	padding-top: 10px;
}

} /*fim da media query*/


.angular-google-map-container{
    height: 500px;
}
map{
    height: 100% !important;
}
.panelmap{
    width: 100%;
    height: 100%;
    position: absolute;
    background: #ccc;
}
#panel{
    position: absolute;
    bottom: 0;
    width: 100%;
    background: rgba(0,0,0,0.75);
    height: 50px;
}
#panel button{
    width: 70px;
    height: 50px;
    background: none;
    border: none;
    margin-right: 40px;
    outline: none;
}
#panel button.active{
    background: #f8c900;
}


#panel button:hover{
    background: #f8c900;
}

#panel button img{
    height: 35px;
    margin-top: 5px;
    width: auto;
    width: auto;
}

.promo_img img{
    width: 100%;
    height: auto;
}

.related_wrap{
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
}
.ng-cloak { display:none; }

.proportCam img, .proportIslands img,.proportEvents img, .proportLive img{
    width: 100%;
}

.leaderboardb{
    display: none;
    width: 100%;
    height: 0px;
}
.spacer{
    width: 100%;
    height: 20px;
    background: red;
}
.leaderboardb a img{
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
}
.leaderboardb.bottom a img{
    padding-bottom: 20px;
}
.leadernew{
    margin-top: 20px;
}

.leadernew img{
    width: 100%;
}
.leaderislands img{
    width: 100%;
}


.last{
    margin-bottom: 40px;
}

.group{
    background: #CCC;
    border: 1px solid black;

}

.gridfooter{
    padding: 0px 10px!important
}
.lateral img{
    width: 100%;
    height: auto;
    margin-bottom: 20px;
}
.video img{
    width: 100%;
    height: auto;
}

.row.related{
    width: 100%;
    margin-left: 0px !important;
    background: #0e4eac;
}
.related h3{
    color: white;
    margin-left: 20px;
}


.related .relvideo{
    height: 200px;
    /*border: 1px solid white;*/
    overflow: hidden;
    padding: 0px;
    background: black;
    width: 32%;
    margin-right: 1.33333333%;
}

.relvideo img{
    height: 100%;
    width: auto;
}
.titlerelated{
  position: absolute;
  width: 100%;
  background: rgba(14,78,172,0.72);
  bottom: 25px;
  text-align: center;
  color: white;

}
.titlerelated h4{
    font-size: 1em;
}


.open_when h5{
text-align: center;
  border-top: 1px solid #DDD;
  padding: 7px 0px;
  border-bottom: 1px solid #DDD;
}

a.maximize img{
    width: 25px;
    background: rgba(0,0,0,0.5);
    position: absolute;
    right: 4px;
    top: 12px;
    padding: 4px;
}

.max_cam{
    margin-top: 100px;
    max-width: 100%;
    max-height: 80vh;
    width: auto;
    height: auto;

}

.black_filter{
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 9999999;
    width: 100%;
    height: 100vh;
    background: rgba(0,0,0,0.9);
    text-align: center;
}
a.closemax{
    position: absolute;
    color: #333;
    background: white;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    line-height: 32px;
    font-weight: bold;
    right: 20px;
    top: 20px;
    text-decoration: none;
}


/*
 * off canvas sidebar
 * --------------------------------------------------
 */
@media screen and (max-width: 768px) {
    .row-offcanvas {
        position: relative;
        -webkit-transition: all 0.25s ease-out;
        -moz-transition: all 0.25s ease-out;
        transition: all 0.25s ease-out;
    }

    .row-offcanvas-left.active {
        left: 33%;
    }

    .row-offcanvas-left.active .sidebar-offcanvas {
        left: -33%;
        position: absolute;
        top: 0;
        width: 33%;
        margin-left: 5px;
    }

    #sidebar, #sidebar a, #sidebar-footer a {
        padding-left:3px;
    }
}




.view {
    margin-top: 20px;
}

.slideLeft.ng-enter, .slideLeft.ng-leave, .slideRight.ng-enter, .slideRight.ng-leave  {
   /* -webkit-transition:all 0.4s;
    transition:all 0.4s;*/
}

.slideLeft.ng-enter {
    left:100%;
}

.slideLeft.ng-enter.ng-enter-active {
    left:0;
}

.slideLeft.ng-leave.ng-leave-active {
/*    left:-100%;*/
}

.slideRight.ng-enter {
    /*left:-100%;*/
}

.slideRight.ng-enter.ng-enter-active {
    left:0;
}
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak, .ng-hide {
    display: none !important;
}


.slideRight.ng-leave.ng-leave-active {
    left:100%;
}


#slides_control > div{
    height: 200px;
}
/*img{
    margin:auto;
    width: 400px;
}*/
#slides_control {
    position:absolute;
    width: 400px;
    left:50%;
    top:20px;
    margin-left:-200px;
}
.widepub iframe{
    width: 100%;
    height: auto;
}



/*.HOME*/

.cams{
    position: relative;
}

.cams p{
    position: absolute;
    width: 100%;
    bottom: 0;
    background: rgba(0,0,0,0.5);
    color: white;
    padding: 10px 0px;
    margin: 0;
    overflow: hidden;
}
.cams img{
    width: 105%;
    height: auto;
}

#sidebar{
    background: #333;
}

.grid-stack>.grid-stack-item>.grid-stack-item-content{
    overflow-y: hidden !important;
}

.grid-stack>.grid-stack-item>.grid-stack-item-content.pubs{
	background: none;
}


.grid-stack>.grid-stack-item>.grid-stack-item-content.event_list_container{
    padding: 0px 18px;
}

.leaderevents img{
    width: 100%;
}


.pubs img{
    width: 100%;
    height: auto;
}

.hidden{
    display: none;
}

.grid-stack-item-content.event img{
    width: 100%;
    height: auto;
}
.grid-stack-item-content.event.fourbyfour img{
    height: 100%;
    width: auto;
}
.content_evento, .content_cams{
  background-color: #FFF;
  box-sizing: border-box;
  color: rgb(44, 62, 80);

  min-height: 340px;
}

.content_evento h3, .content_cams h3{
    min-height: 90px;
}

.content_evento img, .content_cams img{
    width: 100%;
}

.content_pub{

    margin-bottom: 20px;
}


videogular video{
    width: 100%;
}

.bigpic{
    width: 100%;
    height: 450px;
}

.bigpic.events{
    width: 100%;
    height: 400px;
}
.bigpic.events a img{
    width: auto;
    min-height: 400px;
}


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





h4.panel-title{
    font-size: 28px;
}
.panel-group .panel.true{
    background-color: #107ec8;
}
.banner9 img{
    width: 100%;
}
.detailmap{
    height: 400px;
    position: relative;
}
.hotbutton{
    margin-bottom: 20px;
    padding-left: 10px;
    padding-right: 10px;
    position: relative;
    z-index: 999;
    cursor: pointer;
}
.hotbutton.left{
    padding-left: 0;
    padding-right: 10px;
}

.hotbutton.right{
    padding-left: 10px;
    padding-right: 0;
}

.hotbutton a{
    display: block;
    text-align: center;
    color: white;
    background: #f8ca00;
    width: 100%;
    height: 50px;
    line-height: 50px;
    text-decoration: none;
}

.textdiv{
    background: white;
    margin-top: 20px;
}
.infomap{
    width: 200px;
    height: 100%;
    position: absolute;
    right:0;
    top: -50px;
    padding-top: 50px;
    background: rgba(0,0,0,0.6);
}
.infomap img{
    width: 200px;
    height: 150px;
}
.infomap h3{
    color: white;
}
.infomap p{
    margin-top: 10px;
    color: white;
}
.infomap span{
  float: right;
  margin-right: 10px;
  margin-top: 4px;
  font-size: 23px;
}
.skip{
    position: absolute;
    color: blue;
    background: white;
    top: 8px;
    left:8px;
    cursor: pointer;
    padding: 4px 8px;
    z-index: 999;
}
.skipRight{
    position: absolute;
    color: blue;
    background: white;
    top: 8px;
    right:8px;
    cursor: pointer;
    padding: 4px 8px;
    z-index: 999;
}
.Timer{
    position: absolute;
    color: blue;
    background: white;
    top: 8px;
    left:8px;
    cursor: pointer;
    padding: 4px 8px;
    z-index: 999;
}
.TimerRight{
    position: absolute;
    color: blue;
    background: white;
    top: 8px;
    right:8px;
    cursor: pointer;
    padding: 4px 8px;
    z-index: 999;
}
.bandeira{
    border: 1px solid white;
    width: 100px;
    height: 60px;
    margin: auto;
}

.green {
	background-color: #2dff00;
}

.yellow {
	background-color: #fff200;
}

.red {
	background-color: #ff0000;
}

.info_praias{
    margin-bottom: 20px;
    overflow: auto;

}
.pr{
    text-align: center;
}

.pr p{
    padding-top: 25px;
}
.pr p.flagname{
    padding-top: 20px;
    text-transform: uppercase;
    font-size: 12px;
}
.lastupdate{
    text-align: right;
    font-size: 10px;
    text-align: right;
    font-size: 10px;
    margin-top: 10px;
    color: rgba(255,255,255,0.6);
}

.bandeira.vermelha{
    background: #a9242a;
}
.bandeira.amarelo{
    background: #d8a219;
}
.bandeira.verde{
    background: #88931d;
}

.bandeira.xadrez{
    background: url(../img/xadrez.jpg) repeat-x;
}
.coordenadas_cam{
      position: absolute;
      right: 40px;
      z-index: 999999999;
      padding-top: 10px;
      padding-right: 10px;
      background: rgba(0,0,0,0.5);
      padding: 5px 10px;
}
.windguruframe{
    width: 100%;
    height: 300px;
    overflow: hidden;
    border: none;
    margin: auto;
    background: white;
}




.visibletrue{
    left: 0px !important;
}

.visiblefalse{

}
.inLike{
    position: relative;
}

.fb-like{
    overflow: visible;
    position: absolute;
    margin-top: 74%;
    z-index: 99999;
}

.livestream_frame{
  width: 100%;
  height: 700px;
  border: 0px;
  background: black;
}


.livestream_frame.wide{
  height: 440px;


}
.switches{
    position: absolute;
    z-index: 99999;
}

.switchcam{

}
.switchlapse{

    z-index: 99999;
}

videogular.pubCams{
    position: absolute;
    background: black;
}
.likeMe{
    position: absolute;
    width: 100%;
    height: 200px;
    background-image: url('../img/banners_face_like.jpg');
    background-size: cover;
    background-position: center center;
    z-index: 999999999;
    height: 100%
}
.likeMe .fb-like{
    overflow: visible;
    position: absolute;
    margin-top: 37%;
    margin-left: 48%;
    z-index: 99999;
}
.likeMe h3{
    width: 100%;
    text-align: center;
    color: white;
}
videogular.timelapseCams{
     position: absolute;
    background: black;
}
.nmode img{
    width: 100%;
    height: auto;
}

.nmode img.wide{
    height: auto;
    width: 200%;
}

.nmode .legenda span{
    font-size: 1em;
}
.fpraia{
    width: 100%;
}
.fpraia input[type="radio"]{
    margin-left: 8px;
    margin-right: 8px;
}
.fpraia input[type="text"]{
    width: 100%;
    margin-bottom: 20px;
    color: #333;
}
.banner9{
    width: 100%;
    max-height: 200px;
    background: white;
    text-align: center;
}
.contact_container{
    background-color: white;
    padding: 20px;
    margin-left: 20px;
    width: 50%;
    margin-bottom: 35px;
}

.contact_container h1{
    color: #107ec8;
}
.modal-backdrop{
    bottom: 0;
    position: fixed;
    background: transparent;
}
.shiftleft{
    left: 85px !important;
}
.modal.fade:not(.in)  {
    -webkit-transform: translate3d(-25%, 0, 0);
    transform: translate3d(-25%, 0, 0);
}
.btn_servicos{
    text-decoration: none !important;
    color: #107ec8;
    background-color: white;
    position: relative;
    height: 60px;
    line-height: 60px;
    text-align: center;
    cursor: pointer;
}
.serv{
    margin-bottom: 40px;
}
.lista_servico.wrap_servico.intro{
    line-height: 20px;
    padding: 24px 20px 10px 24px !important;

}
a#serv_contact{
    display: block;
    height: 60px;
    width: 100%;
    background-color: #107dc7;
    border: none;
    color: white;
    transition: .2s all linear;
}
a#serv_contact:hover{
    background-color: #f8c900;
}

.searchdiv{
    padding:0;
}
.servico_coluna{
    padding: 8px;
}
.serv h1{
    color: #107dc7;
    font-size: 3em;
    margin-left: 10px;
}

.wrap_servico{
    padding: 8px;
    position: relative;
    line-height: 60px;
    text-align: center;
}

.wrap_servico.header{
    background-color: #107ec8;
    color: white;
    background-image: url(../img/icones/rec.svg);
    background-repeat: no-repeat;
    background-size: 30px;
    background-position: 10px 10px;
}

.wrap_servico.desc{
    background-color: #0c4c77;
    color: white;
}
.wrap_servico.lista_servico{
    background-color: white;
    color: #107ec8;
    text-align: left;
    line-height: 38px;
}

.wrap_servico.lista_servico ul{
    padding: 0px 20px 0px 30px;
}
.wrap_servico.lista_servico li{
    margin: 0;
    padding: 0;
    border-bottom: 1px solid #ccc;
}
.azores{
    width: 100%;
    height: 100%;
    background-color: #2f2776;
    background-image: url(../img/logoAcores.svg);
    background-repeat: no-repeat;
    background-position: center center;
}
.parceiro{}

.parceiro p{
  width: 100%;
  height: 28px;
  background: #107dc7;
  color: white;
  width: 100%;
  text-align: center;
  line-height: 28px;
  padding: 0;
  margin: 0;
}
span#close{
    background: white;
    font-size: 30px;
    padding: 3px 12px;
    margin-top: 10px;
    position: absolute;
    top: 5px;
    right: 10px;
    cursor: pointer;
}
.banner_top img{
    width: 100%;
}
.padd{
    padding: 0px 30px;
    margin-top: 0px;
}
.barra_pub.acerto3{
    top: 150px;
}
.barra_pub.acerto4{
    top: 130px;
}
.barra_pub.acerto5{
    top: 580px;
}
.barra_pub.acerto{
    top: 500px;
}
.barra_pub.acerto2{
    top: 0px;
}
.barra_pub.acerto6{
    top: 230px;
}
.barra_pub.acerto7{
    top: 420px;
}
.barra_pub.acerto8{
    top: 400px;
}

.home .foot_wrap{
    padding: 0px 10px;
    float: left;
    width: 100%;
}
.nothome .foot_wrap{
    padding: 0px 0px 0px 10px;
}
/*PUBS*/
.adsense{
    position: absolute;
}
.publicidade{
    margin-top: 270px;
}
.destaquelive{
    padding: 0 !important;
}
.destaquelive img{
    width: 100%;
}
.destaquelive .owl-item .desclive{
    position: absolute;
    bottom: 0;
    width: 100%;
    text-align: center;
}
.hotspotrow{
    min-height: 1000px;
}

.nomedohp{
    position: absolute;
    z-index: 999;
    right: 10px;
    top: 10px;
    color: white;
    background: #107ec8;
    padding: 4px 8px;
    border-radius: 8px;
}

.wifihere{
   background-color: #107dc7;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  float: left;
  margin-top: 10px;
  margin-right: 8px;
}
.wifihere img{
	width: 30px;
    margin-top: 6px;
    margin-left: 5px;
}

.pub_mobile{
    width: 100%;
    margin-top: 1%;
    margin-bottom: 1%;
    overflow: auto;
}
.pub_mobile a{
    display: block;
    width: 49%;
    float: left;
}
.pub_mobileWide a{
    display: block;
    width: 100%;

}
.pub_mobileWide a img{
    width: 100%;
}

.pub_mobile a img{
    width: 100%;
}
.ui-dialog .ui-resizable-se {
   background-image: url("");
}
.how img {
    width: 100%;
    height: auto;
}
ul.dropdown.langs{
    position: absolute;
    right: 0;
}



.hidelang{
    display: none;
}
.showlang{
    display: block;
}





.nomeonde{
  background: #07306c;
  font-size: 1em;
  width: 100%;
  min-height: 60px;
  bottom: 0;
  padding-top: 10px;
  text-align: center;
}
.ico_cam{
  position: absolute;
  z-index: 999999;
  top: 10px;
  right: 12px;
  width: 40px;
  padding: 6px;
  background-color: #337ab7;
  border-radius: 2px;
}
.ico_cam img{
    width: auto;
  height: 100%;
  margin: 0;
  padding: 0;
}

.bt_grande{
  background-color: rgba(0,0,0,0.2);
  border: none;
  position: absolute;
  top: 10px;
  right: 10px;
  font-size: 24px;
  outline: 0;
  padding: 1px 7px;
  border-radius: 5px;
  color: white;
}

.ngdialog.ngdialog-theme-default.popCamera .ngdialog-content{
    width: 98%;
}
.nome_hs{
  position: absolute;
  z-index: 999;
  right: 10px;
  top: 10px;
  color: white;
  background-color: #107ec8;
  padding: 4px 11px;
  border-radius: 4px;
}


/*NEW STYLE*/

.fundo_mobile {
    position: fixed;
    z-index: 1;
    width: 100%;
    height: 120%;
}

.fundo_mobile img {
    min-height: 100%;
    min-width: 1024px;
    width: 100%;
    height: auto;
    position: fixed;
    top: 0;
}
.foot_wrap{
	padding: 0px 10px;
}

.grcontainer{
	padding-bottom: 20px;
	margin-top: 0px;
}


.camdetailtabs{
	background: #0e4eac;
}

.camdetailtabs .nav>li>a {
    font-size: 1.2em;
    font-weight: normal;
}

.camdetailtabs .nav-pills>li>a{
	border-radius: 0;
}

.camdetailtabs .tab-content{
	background-color: #107ec8;
}

.camdetailtabs .nav-pills>li.active>a{
	background-color: #107ec8;
}

.camdetailtabs .tab-pane{
	padding: 20px;
}

.camdetailtabs p{
	color: white;
}
.firstrow .cam_meteo{
	min-height: 230px;
}

a.button_arquivo{
	display: block;
    text-align: center;
    color: #fff;
    background: #107ec8;
    width: 100%;
    height: 50px;
    line-height: 50px;
    text-decoration: none;
}

.listavideos{
	padding-left: 30px;
}

.videobox{
	width: 300px;
	height: 262px;
	float: left;
	padding-right:10px;
}

.sovideo{
	    width: 100%;
    position: relative;
    overflow: hidden;
    height: 163px;
}

.sovideo img {
        width: 100%;
    position: absolute;
    top: -28px;
}

.legenda_texto{
    display: table-cell;
    background: #107ec8;
    color: white;
    height: 50px;
    width: 300px;
    vertical-align: middle;
    text-align: center!important;
    padding: 0px 10px;
	font-size: 11px;
}

.cam.square img {
    width: 135%;
    height: auto;
    margin-left: -15%;
}

.legenda_texto span:hover{
	text-decoration: none;
}

.container_video a{
	text-decoration: none;
}

.box_heading{
	display: block;
	background: #0e4eac;
	color: white;
	font-size: 1em;
	padding: 20px;
	border-bottom: 1px solid white;
	cursor: pointer;
}

.box_heading:hover{
	background: #337ab7;
}

.boxtitle{
	font-size: 24px;
}
.boxbody{
	padding-top: 20px;
	display: none;
}

.titulo{
	float: left;
}


.cam_by{
    width: 340px;
    margin-right: 20px;
    margin-top: 30px;
}

.cam_by span{
    color: #107dc7;
    margin-right: 12px;
    float: right;
    margin-top: 20px;
}

.cam_by img{
    width: auto;
    float: right;
    max-height: 50px;
}

.sponsorlink{
	width: 200px;
	height: 200px;
}
.sponsorlink img{
max-width: 90px;
    max-height: 90px;
    width: auto;
    height: auto;
    margin-left: 30px;
    float: right;
    margin-top: 10px;
}
.popup{
    position: absolute;
    z-index: 1000;
    max-width: 460px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.popup img{
    width: 100%;
}
.popup span#close{
    color: black;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    line-height: 33px;
}

.threebythree img{
    height: 100%;
    width: auto;
}


.exemplos{
    overflow: auto;
    padding-bottom: 20px;
}

.exemplos a{
    width: 20%;
    float: left;
}

.exemplos a img{
    width: 100%;
    height: auto;
}


@media (max-width:768px) {

    .firstrow .cam_meteo {
        min-height: 170px;
    }

    .container-fluid.meteo_mobile {
        padding-top: 0px;
    }


    .popup {
        display: none;
    }

    .grid-stack.grid-stack-one-column-mode > .grid-stack-item {
        position: relative!important;
        width: 50%!important;
        float: left;
        left: 0!important;
        top: auto!important;
        margin-bottom: 20px
    }



    .grid-stack.grid-stack-one-column-mode > .grid-stack-item.leaderboard,
    .grid-stack.grid-stack-one-column-mode > .grid-stack-item.map,
    .grid-stack.grid-stack-one-column-mode > .grid-stack-item.wide {
        width: 100%!important;
        height: auto;
    }
    .grid-stack.grid-stack-one-column-mode > .grid-stack-item.map {
        height: 300px!important
    }
    .grid-stack.grid-stack-one-column-mode > .grid-stack-item.footer {
        width: 100%!important;
        height: 60px!important
    }
    .grid-stack {
        height: auto!important
    }
    .foot_wrap {
        padding: 0px 10px;
        float: left;
    }

    .grid-stack.grid-stack-one-column-mode {
        height: auto !important;
        overflow: auto;
        padding: 0;
        margin: 0;
    }
    .grid-stack.grid-stack-one-column-mode > .grid-stack-item.square.threebythree a img{
        width: 100% !important;
        height: auto !important;
    }

    ul.navigation {
        background-color: rgba(0,0,0,0.8);
    }

    .menumobile{
        display: none;
    }
    .videobox {
        float: none;
        margin: auto;
    }

    .button_arquivo{
        margin-bottom: 20px;
    }

    .contact_container {
    padding: 10px;
    margin-left: 0;
    width: 100%;
    }
    .container-fluid {
    padding-top: 100px;
    }
}

.preroll{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: black;
}
