﻿/* Large Screen */
@media screen and (min-width: 1024px){

}

/* Tablet */
@media screen and (max-width: 1023px){
  	.card-employee .c-content{
      	padding: 15px 0px 20px 0px;
    }
  
  	.card-employee .c-content > div{
      	padding: 0px 10px;
    }
  
  	.c-content a {
        word-wrap: break-word;
    }
  
    header, .tab, footer{
        width: 100%;
    }

    header{
        left: 0px;
    }
    
    .team .text{
        padding: 15px;
    }

    .team .text h3{
        margin-top: 0px;
    }

    .team .text img{
        width: 120px;
        bottom: -80px;
    }

    #weOfferArticles, #hintArticles{
        padding: 0px 10px;
    }

    #weOfferArticles .col-xs-4, #hintArticles .col-xs-4, #employeesGroup, #meetUsArticles, #allArticles{
        padding: 0px 5px;
    }

    .map-tooltip{
        bottom: 74px;
    }

    .offer{
        padding-bottom: 40px;
    }

    .card-text h3{
        font-size: 20px;
        word-wrap: break-word;
    }

    .we-offer-header .contact-us-btn{
        padding: 15px 30px;
    }

    .hint-category-cards .card-text{
        padding: 5px;
    }

    .hint-category-cards .card-text h3{
        font-size: 19px;
    }

    .pagination button{
        padding: 5px 8px;
        margin: 0px 5px;
    }

    .search-pagination{
        display: block;
    }

}


@media screen and (min-width: 801px) and (max-width: 1040px) {
    .map-tooltip{
        right: 59.5%;
        bottom: 91px;
    }
}

@media screen and (min-width: 461px) and (max-width: 700px){
  	.card-wrapper{
  		width: 50%;
  	}
}

@media screen and (max-width: 700px){
	header{
        display: none;
    }

    .header-mobile{
        display: block;
    }

    .nav-menu-mobile{
        background: #6997C7;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 70px;
    }

    .nav-menu-mobile > .col-xs-3{
        display: flex;
        justify-content: flex-end;
        align-items: center;
        color: white;
    }

    .nav-items-mobile{
        display: none;
    }

    .nav-items-mobile ul{
        text-align: right;
        list-style: none;
        padding-right: 15px;
        color: white;
        width: 100%;
        color: white;
        margin-top: -10px;
        margin-bottom: 0px;
    }

    .nav-items-mobile .nav-items-bottom-ul{
        margin-bottom: 10px;
        margin-top: 0px;
    }

    .nav-items-mobile ul li{
        padding: 5px 0px;
        font-size: 18px;
    }

    .nav-items-mobile ul li a{
        color: white;
    }
  
  	.card-employee{
        width: calc(100% - 10px);
        right: 5px !important;
    }

    #cards {
        padding-bottom: 10px;
    }
  
  	.c-action{
        position: relative;
        float: right;
        margin-bottom: 10px;
    }

    .c-content {
        padding-bottom: 20px;
    }

    .c-content a{
        word-wrap: break-word;
    }
  	
  	.no-results{
        margin-top: 10px;
    }

    .pagination{
        display: none;
    }

    .pagination-mobile{
        display: block;
        padding-top: 60px;
    }

    .prev-btn{
        left: 15px;
        top: 20px;
    }

    .next-btn{
        right: 15px;
        top: 20px;
    }

    .pagination-mobile > div{
        background: lightgray;
        padding: 10px 20px;
        display: flex;
        align-items: center;
        position: absolute;
    }

    .pagination-mobile > div > i{
        margin: 0px 5px;
    }   

    .page {
        margin-bottom: 30px;
        margin-top: 70px;
    }   

    .front-page.tab {
        margin-top: 70px;
    }

    .br > a:first-child{
        padding-left: 10px;
    }

    .br > a{
        padding: 0 10px 0 25px;
        line-height: 30px;
    }

    .br > a::after{
        right: -15px;
        width: 30px;
        height: 30px;
    }

    #allArticles{
        padding: 0px;
    }

    #weOfferArticles, #hintArticles{
        padding: 0px;
    }

    .cards-container{
        padding: 5px 10px;
    }

    .search-box{
        flex-direction: column;
    }

    .search-box span, .search-box input{
        width: 100%;
    }

    .search-box input{
        margin-top: 10px;
    }

    .team .text{
        padding: 30px 15px;
    }

    .team{
        padding: 0px;
    }

    .front-page-card{
        margin: 7px 0px;
    }

    .footer-content{
        padding: 20px 5px;
        flex-direction: column;
    }

    .footer-content > div:first-child{
        padding-bottom: 20px;
    }

    .footer-content .input input{
        width: 60%;
    }

    .footer-map{
        margin-top: 50px;
    }

    .footer-map-img{
        display: none;
    }

    .footer-map-img-mobile{
        display: block;
    }

    #pin1 {
        left: 65%;
    }

    #pin2 {
        left: 55.5%;
    }

    .map-tooltip{
        bottom: 107px;
        right: 39%;
        width: 250px
    }
}

/* Phone */
@media screen and (max-width: 460px) {    
  
    
}

/* Mobile M */
@media screen and (min-width: 321px) and (max-width: 376px) {
    .map-tooltip{
        width: 220px;
        bottom: 90px;
    }

    .pagination-mobile{
        padding-top: 80px;
    }
}

/* Mobile S */
@media screen and (max-width: 321px) {
    .map-tooltip{
        width: 200px;
        bottom: 70px;
        right: 39%;
    }

    .pagination-mobile{
        padding-top: 80px;
    }
}