Blancamaco (Talk | contribs) |
|||
Line 103: | Line 103: | ||
padding-right: 1em; | padding-right: 1em; | ||
} | } | ||
+ | |||
+ | /* The Modal (background) */ | ||
+ | .modal { | ||
+ | display: none; /* Hidden by default */ | ||
+ | position: fixed; /* Stay in place */ | ||
+ | z-index: 8888; /* Sit on top */ | ||
+ | left: 0; | ||
+ | top: 0; | ||
+ | width: 100%; /* Full width */ | ||
+ | height: 100%; /* Full height */ | ||
+ | overflow: auto; /* Enable scroll if needed */ | ||
+ | background-color: rgb(0,0,0); /* Fallback color */ | ||
+ | background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ | ||
+ | } | ||
+ | |||
+ | /* Modal Content/Box */ | ||
+ | .modal-content { | ||
+ | background-color: #fefefe; | ||
+ | margin: 10vh auto; /* 15% from the top and centered */ | ||
+ | padding: 20px; | ||
+ | border: 1px solid #888; | ||
+ | width: 90%; /* Could be more or less, depending on screen size */ | ||
+ | } | ||
+ | @media (min-width: 1366px) { | ||
+ | .modal-content { | ||
+ | background-color: #fefefe; | ||
+ | margin: 10vh auto; /* 15% from the top and centered */ | ||
+ | padding: 20px; | ||
+ | border: 1px solid #888; | ||
+ | width: 30%; /* Could be more or less, depending on screen size */ | ||
+ | } | ||
+ | } | ||
+ | |||
+ | /* The Close Button */ | ||
+ | .close { | ||
+ | color: #aaa; | ||
+ | float: right; | ||
+ | font-size: 28px; | ||
+ | font-weight: bold; | ||
+ | } | ||
+ | |||
+ | .close:hover, | ||
+ | .close:focus { | ||
+ | color: black; | ||
+ | text-decoration: none; | ||
+ | cursor: pointer; | ||
+ | } | ||
+ | |||
</style> | </style> | ||
</html> | </html> |
Revision as of 11:49, 10 September 2018