Team:Northwestern/css/home
@charset "UTF-8";
- home {
margin-top: 20px; margin-left: 5px; margin-right: 5px; margin-bottom: 20px; padding-left: 120px; padding-right: 110px; font-family: josefin-sans; font-style: normal;}
- home a {
color: #000000; text-decoration: underline; }
- home a:hover {
color: #000000; font-style: italic; text-decoration: none; }
- home article .divider {
display: block; max-height: 30px; margin-top: 30px; margin-bottom: 30px; } .ch-grid { margin-right: 0; margin-left: 0; margin-bottom: 0; list-style: none; display: block; text-align: center; width: 100%; margin-top: 20px; padding-left: 0px; }
.ch-grid:after, .ch-item:before { content: ;
display: table;
}
.ch-grid:after { clear: both; }
.ch-grid li { width: 220px; height: 220px; display: inline-block; margin: 20px; } .ch-item { width: 100%; height: 100%; border-radius: 50%; position: relative; cursor: default; box-shadow: inset 0 0 0 16px rgba(255,255,255,0.6), 0 1px 2px rgba(0,0,0,0.1);
-webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; }
.ch-img-1 {
background-image: url(
);
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
}
.ch-img-2 {
background-image: url(
);
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
}
.ch-img-3 {
background-image: url(
);
background-repeat: no-repeat;
background-position: center center;
background-size: contain;
}
.ch-info { position: absolute; background: rgba(10,8,71, 0.8); width: inherit; height: inherit; border-radius: 50%; opacity: 0;
-webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out;
-webkit-transform: scale(0); -moz-transform: scale(0); -o-transform: scale(0); -ms-transform: scale(0); transform: scale(0);
-webkit-backface-visibility: hidden;
}
.ch-info h3.ch-bubble { color: #fff !important; text-transform: uppercase !important; letter-spacing: 2px !important; font-size: 22px !important; margin: 0 30px !important; padding: 45px 0 0 0 !important; height: 140px !important; font-family: josefin-sans;
text-align: center !important;
text-shadow: 0 0 1px #fff, 0 1px 2px rgba(0,0,0,0.3); font-style: normal; font-weight: 100; }
.ch-info p { color: #fff; padding: 10px 5px !important; font-style: italic !important; margin: 0 30px !important; font-size: 12px !important;
text-align: center !important;
border-top: 1px solid rgba(255,255,255,0.5); opacity: 0; -webkit-transition: all 1s ease-in-out 0.4s; -moz-transition: all 1s ease-in-out 0.4s; -o-transition: all 1s ease-in-out 0.4s; -ms-transition: all 1s ease-in-out 0.4s; transition: all 1s ease-in-out 0.4s; font-family: josefin-sans; font-weight: 100; }
.ch-info p a.ch-bubble{ color: #fff !important; text-decoration: none !important; color: rgba(255,255,255,0.7) !important; font-style: normal !important;
text-align: center !important;
font-weight: 700 !important; text-transform: uppercase !important; font-size: 9px !important; letter-spacing: 1px !important; padding-top: 4px !important; font-family: josefin-sans; }
.ch-info p a.ch-bubble:hover { color: #bf83a5 !important; text-decoration: none !important; font-style: normal !important; color: rgba(191,131,165, 0.8) !important; }
.ch-item:hover { box-shadow: inset 0 0 0 1px rgba(255,255,255,0.1), 0 1px 2px rgba(0,0,0,0.1); } .ch-item:hover .ch-info { -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); -ms-transform: scale(1); transform: scale(1); opacity: 1; }
.ch-item:hover .ch-info p { opacity: 1; }
- home footer {
margin-top: 40px; }
