a, a:visited, a:focus, a:active, a:hover{
    outline:0 none !important;
}
html, body { height: 100%;  }
html, body, h1, h2, h3, h4, h5, h6{ font-family: Roboto, sans-serif;}
body {background-color: #fff; font-family: 'Playfair Display', serif;}

.content
{
    position: relative;   
}
/*.header .search-box { position: absolute; left: 20px; top: 20px; background-color: #eee;}
.header .search-box input { background: none; padding: 0 20px; border: none; width: 200px;}
.header .search-box a {background: #555; display: inline-block;}
.header .search-box i {color: #fff; padding: 10px 12px;}*/

.business {padding: 50px 0 150px 0; text-align: center; color: #aaa; transition: color 0.3s;}
.business a {color: #aaa; text-decoration: none; transition: color 0.3s;}
.business a:hover {color: #555;}
.public-company-logo {font-size: 24px; font-weight: normal; letter-spacing: 1px; font-family: 'Playfair Display';}
.public-company-logo a {transition: color 0.3s; text-decoration: none; color: #222 !important; }
.public-company-logo a:hover {color: #555;}
.public-company-logo img { max-height: 120px; max-width: 300px; }


/*
.collection-thumbs {margin: 0 0 0 0; display: flex; flex-wrap: wrap; justify-content: center;}
.collection-thumbs li {width: 20%; padding-bottom: 20%; position: relative; box-sizing:border-box; }
.collection-thumbs .wrapper {position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: #fff;}
.collection-thumbs li .cover {height: 100%; background-size: cover;}
.collection-thumbs li a > div:first-child {position: relative;}
.collection-thumbs div.overlay {position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.8); opacity: .2; color: #fff; transition: opacity 0.3s;}
.collection-thumbs div.overlay:hover {opacity: 1.0;}
.collection-thumbs .overlay div {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    text-shadow: 0 0 2px #222;
    text-transform: uppercase;
    font-size: 12px;
}
.collection-thumbs .details {color: #fff; font-weight: 400; font-size: 26px; letter-spacing: 1px; text-align: center; width: 100%;
                             position: absolute; top: 50%; transform: translateY(-50%); text-shadow: 0 0 2px #555;
}
.collection-thumbs .details > div { font-size: 12px;}


.collection-thumbs li:hover .cover {border-color: #ccc;}
.collection-empty{text-align: center; padding: 200px 0; text-transform: uppercase; font-size: 14px; letter-spacing: 2px; color: #111;  margin-bottom: 40px;}*/

.content-flex{display: flex; flex-direction: row;}
.content-flex > div {flex-grow: 1; width: 40%;  margin-bottom: 15px;}
.header .social {flex: 0 1 auto; text-align: center; font-size: 20px;}
.header .social li {display: inline-block; margin: 0 6px;}

.nav .social { font-size: 24px;}
.nav .social li {display: inline-block; margin:  6px;}
.nav .social a { color: #aaa; text-decoration: none; transition: color 0.3s;}
.nav .social a:hover { color: #555;}

.footer
{
    margin: 0 auto 20px auto;
    padding: 20px 20px 20px 20px;
    text-align: right;
    position: relative;    
    display: block;
    font-size: 14px;
    font-family: Roboto, sans-serif;
}

.footer, .footer a, .header a
{
    color: #aaa; /* #ccffff; */
    text-decoration: none;
    transition: color 0.3s;
}
.footer a:hover, .header a:hover
{
    color: #555;
    transition: color 0.3s;
}


.footer .credit a
{
    font-weight: bolder !important;
    color: #888;
}
.footer .credit a:hover {color: #555;}

@media screen and (max-width:1200px) {
    .business {padding: 130px 0;}
    .public-company-logo {font-size: 28px;}
/*    .collection-thumbs li {width: 25%; padding-bottom: 25%;}
    .collection-thumbs .details {font-size: 20px;}*/
}

@media screen and (max-width:900px) {
    .footer {font-size: 12px;}
    .business {padding: 110px 0;}
    .public-company-logo {font-size: 24px;}
/*    .collection-thumbs li {width: 33.333%; padding-bottom: 33.333%;}
    .collection-thumbs .details {font-size: 16px;}*/
    .social {right: 0;}
    .social a {font-size: 14px;}
}

@media screen and (max-width:600px) {
    .business {padding: 80px 0;}
    .public-company-logo {font-size: 20px;}
/*    .collection-thumbs li {width: 50%; padding-bottom: 50%;}
    .collection-thumbs .details {font-size: 14px;}
    .collection-thumbs .wrapper {}
    .collection-thumbs .details {}*/
    .collection-empty {padding: 50px 0;}

    .content-flex { flex-wrap: wrap; padding-left: 5px;}
    .content-flex > div {width: 100%; text-align: left !important;}
}