
.cursor { cursor: pointer; }



#box{ 

    height:30px;
    text-align:center;
}


#sidebar{

    display : none;

    background-size: 100% 100%;
    background-repeat: no-repeat;	
    height:300px;
}

#pub{ 

    background-size: 100% 100%;
    background-repeat: no-repeat;
    height:300px;
    width:300px;
    border: 3px solid;
}

.hidden_pub {
    display: none;
}

.show_pub:hover + .hidden_pub {
    display: block;
}


#blanket {
    background-color:#111;
    opacity: 0.65;
    *background:none;
    position:absolute;
    z-index: 9001;
    top:0px;
    left:0px;
    width:100%;
}

#popUpDiv {
    position:absolute;
    
    background-color: white;
    width:400px;
    height:400px;
    border:2px solid lightgrey;
    border-radius: 2px;
    z-index: 9002;
    top: 10%;
    left: 0px;
    margin-left: auto;
    margin-right: auto;

}

#popUpDiv button {
    width: 28px;
    height: 30px;
    font-size: 22px;
    position:relative; 
    float: right;
    text-decoration: none;
    color: grey;
    text-align: center;
    padding: 0;
    padding-left: 1px;
    line-height: 1.42;
    border-radius: 15px;
    background-color: lightgrey;
    margin-right: -15px;
    margin-top: -15px;
}

#popUpDiv button:hover,
#popUpDiv button:focus,
#popUpDiv button:active{
    opacity: 1;
    color: #373737;
    background-color: grey;
}




.close-link{
    font-size: 18px;
    text-decoration: none;
    color: lightgrey;
    padding: 2px 3px 0 0;
}

.close-link:hover,
.close-link:focus,
.close-link:active{
    color: #373737;
}

.highlight{
    background-color: rgb(51,122,183);
}    


.sociais_div{
/*    position: absolute;
    top: 5px;
    right: 18%;
    width: 100px;*/
    //background-color: #3B7E95;
    margin-right: 25px; 
    padding-top: 25px;
    display: inline-block;
    text-align: center;
}

.sociais_facebook{
    background-color: #1E1E1E;
    position:relative;
    width:35px;
    height:35px;
    background-image:url('/img/facebook.png');
    background-repeat: no-repeat;
    background-size: 100%;
    display: inline-block;
}

.sociais_facebook:focus,
.sociais_facebook:active,
.sociais_facebook:hover{
    background-color: #405D9B;
}

.sociais_twitter{
    background-color: #1E1E1E;
    position:relative;
    width:35px;
    height:35px;
    background-image:url('/img/twitter.png');
    background-repeat: no-repeat;
    background-size: 100%;
    display: inline-block;
}

.sociais_twitter:focus,
.sociais_twitter:active,
.sociais_twitter:hover{
    background-color: #149bdf;
}

.sociais_whatsapp{
    background-color: #1E1E1E;
    position:relative;
    width:35px;
    height:35px;
    background-image:url('/img/whatsapp.png');
    background-repeat: no-repeat;
    background-size: 100%;
    display: inline-block;
}

.sociais_whatsapp:focus,
.sociais_whatsapp:active,
.sociais_whatsapp:hover{
    background-color: #33CC33;
}
                                    

.sociais_instagram{
    background-color: #1E1E1E;
    position:relative;
    width:35px;
    height:35px;
    background-image:url('/img/instagram.png');
    background-repeat: no-repeat;
    background-size: 100%;
    display: inline-block;
}

.sociais_instagram:focus,
.sociais_instagram:active,
.sociais_instagram:hover{
    background-color: #125688;
}

.sociais_youtube{
    background-color: #1E1E1E;
    position:relative;
    width:35px;
    height:35px;
    background-image:url('/img/youtube.png');
    background-repeat: no-repeat;
    background-size: 100%;
    display: inline-block;
}

.sociais_youtube:focus,
.sociais_youtube:active,
.sociais_youtube:hover{
    background-color: #bb0000;
}

.sociais_android{
    background-color: #1E1E1E;
    position:relative;
    width:35px;
    height:35px;
    background-image:url('/img/android.png');
    background-repeat: no-repeat;
    background-size: 100%;
    display: inline-block;
}

.sociais_android:focus,
.sociais_android:active,
.sociais_android:hover{
    background-color: #3ddc84;
}

.sociais_ios{
    background-color: #1E1E1E;
    position:relative;
    width:35px;
    height:35px;
    background-image:url('/img/ios.png');
    background-repeat: no-repeat;
    background-size: 100%;
    display: inline-block;
}

.sociais_ios:focus,
.sociais_ios:active,
.sociais_ios:hover{
    background-color: #6a6a6a;
}

#sociais_corpo{
    width:100px;
    height:35px;
    background-image:url(/img/final.png);
    background-repeat: no-repeat;
    background-size: 100%;
    _background-color:red;
}

#sociais_facebook{
    position:relative;
    width:33px;
    height:35px;
    left:0px;
    top:0px;
    border-radius:35px;
}

#sociais_facebook:hover {
    background: #405D9B; /*DEFINE AQUI A COR DO TEMA*/
    border-radius:50px;
    background-image:url('/img/facebook.png');
    background-repeat: no-repeat;
    background-size: 100%;
}

#sociais_twitter{
    position:relative;
    width:33px;
    height:35px;
    left:33px;
    top:-35px;
    _background:blue;
}

#sociais_twitter:hover {
    background:#149bdf ; /*DEFINE AQUI A COR DO TEMA*/
    border-radius:50px;
    background-image:url('/img/twitter.png');
    background-repeat: no-repeat;
    background-size: 100%;

}

#sociais_google{
    position:relative;
    width:33px;
    height:35px;
    left:66px;
    top:-70px;
    _background:blue;
}

#sociais_google:hover {
    background: #c9302c; /*DEFINE AQUI A COR DO TEMA*/
    border-radius:50px;
    background-image:url('/img/google.png');
    background-repeat: no-repeat;
    background-size: 100%;

}


/* Style all font awesome icons */
.fa {
  padding: 11px;
  font-size: 30px;
  height: 50px;
  width: 50px;
  text-align: center;
  text-decoration: none;
  margin: 2px 2px;
}

.fa:hover {
    opacity: 0.7;
}

/* Facebook */
.fa-facebook {
  background: #3B5998;
  color: white;
}

/* Twitter */
.fa-twitter {
  background: #55ACEE;
  color: white;
}

/* Youtube */
.fa-youtube {
  background: #bb0000;
  color: white;
}

/* Instagram */
.fa-instagram {
  background: #125688;
  color: white;
}

.div_date{
    //padding-top: 70px; 
    margin-right: 25px; 
    float: right; 
    color: #595959; 
    font-family: 'Arial Black', Gadget, sans-serif;
}


@media  (max-width: 500px) {
    
    #popUpDiv {
        width:200px;
        height:200px;
        
    }
    
}

@media (max-width: 528px) {
    .sociais_div{
        padding-top: 0px; 
    }
    
}


@media (min-width: 500px) and (max-width: 800px) {
    
    #popUpDiv {
        width:300px;
        height:300px;
    }
    
}

@media (min-width: 568px) and (max-width: 767px){
    
    #div_weather{
        margin-top: 40px;
    }
    
}


@media (min-width: 768px) and (max-width: 991px){
    .sociais_div{
        //padding-top: 0px; 
    }
}

@media (min-width: 769px){
    
    #show_phone{
        display: none;
    }
    
    .hidden-phone{
        display: block;
    }
    
}

@media (max-width: 768px){
    
    #show_phone{
        display: block;
    }
    
    .hidden-phone{
        display: none;
    }
    
}


@media (max-width: 1049px) {
    .navbar-collapse.collapse {
        display: none !important;
    }
    .navbar-collapse.collapse.in {
        display: block !important;
    }
    .navbar-header .collapse, .navbar-toggle {
        display:block !important;
    }
    .navbar-header {
        float:none;
    }
    
    #div_search_collaped{
        display: inline-table;
    }
    
    #div_search{
        display: none;
    }
    
    .my_navbar{
        padding: 0;
    }
}

@media (max-width: 1050px) {

  .mylogin{
        right: 0;
    }
}


@media (min-width: 1050px) {

    .mylogin{
        right: 4%;
    }
    
    #div_search_collaped{
        display: none;
        
    }
    
    #div_search{
        display: inline-table;
    }
}

@media (min-width: 1200px) and (max-width: 1360px) {
  .container {
    width: 1070px;
  }
  
}



@media (min-width: 1361px) {
  .container {
    width: 1170px;
  }
  
  .mylogin{
        right: 5%;
    }
}

@media (min-width: 1450px) {
  .container {
    width: 1400px;
  }
  
  .mylogin{
        right: 6%;
    }
}

@media (min-width: 1600px) {

  .mylogin{
        right: 11%;
    }
}

@media (min-width: 1800px) {

  .mylogin{
        right: 16%;
    }
}

@media (min-width: 2100px) {

  .mylogin{
        right: 21%;
    }
}
