1/*-----------------------------------------------------------------------------
2# Copyright (c) 2020, Arm Limited. All rights reserved.
3#
4# SPDX-License-Identifier: BSD-3-Clause
5#
6#----------------------------------------------------------------------------*/
7
8/* Limit page width */
9@media only screen and (min-width: 780px) {
10    .wy-nav-content {
11        max-width: 1100px;
12    }
13}
14
15/* Flexbox Tile Grid Settings  */
16.grid {
17    list-style-type: none !important;
18    display: -webkit-box;
19    display: -ms-flexbox;
20    display: flex;
21    -ms-flex-wrap: wrap;
22        flex-wrap: wrap;
23    -webkit-box-pack: center;
24        -ms-flex-pack: center;
25            justify-content: center;
26    margin: 1rem auto;
27    max-width: calc((250px + 2rem) * 4);
28}
29
30.grid-item {
31    list-style-type: none !important;
32    -webkit-box-flex: 0;
33        -ms-flex: 0 0 auto;
34            flex: 0 0 auto;
35    width: 200px;
36    text-align: center;
37    margin: 1rem;
38}
39
40.grid-item a {
41    display: block;
42    width: 190px;
43    height: 190px;
44    padding: 12px;
45    display: -webkit-box;
46    display: -ms-flexbox;
47    display: flex;
48    -webkit-box-orient: vertical;
49    -webkit-box-direction: normal;
50        -ms-flex-direction: column;
51            flex-direction: column;
52    -webkit-box-pack: center;
53        -ms-flex-pack: center;
54            justify-content: center;
55    -webkit-box-align: center;
56        -ms-flex-align: center;
57            align-items: center;
58    border: 1px solid #c6cbce;
59    background-color: #2980B9;
60    color: white;
61}
62
63.grid-item h2 {
64    font-size: 1rem;
65    margin-bottom: 0.5rem;
66}
67
68.grid-item img {
69    max-width: 75%;
70    margin-bottom: 0.5rem;
71}
72
73
74.grid-item a:hover {
75    background-color: #32cd32;
76    color: white;
77}
78