SU-SWS/stanford_profile_helper

View on GitHub
modules/jumpstart_ui/dist/css/card.css

Summary

Maintainability
Test Coverage
.su-card{background-color:#fff;border:1px solid #e3e3e3;-webkit-box-shadow:0 3px 6px rgba(0,0,0,.13),0 3px 6px rgba(0,0,0,.1);box-shadow:0 3px 6px rgba(0,0,0,.13),0 3px 6px rgba(0,0,0,.1);display:block}@media only screen and (min-width:0) and (max-width:575px){.su-card figure,.su-card img{display:none}}.su-card .su-card__contents{font-family:Source Sans\ 3,Source Sans Pro,Helvetica Neue,Helvetica,Arial,sans-serif;padding:3rem}@media only screen and (min-width:768px){.su-card .su-card__contents{padding:3.6rem}}@media only screen and (min-width:1500px){.su-card .su-card__contents{padding:3.8rem}}.su-card .su-card__contents p{font-size:1.8rem;line-height:1.3}@media (max-width:767px){.su-card .su-card__contents p{font-size:1.6rem}}.su-card .su-card__contents>:first-child{margin-top:-.3em;padding-top:0}.su-card .su-card__contents>:last-child:not(.su-card__button){margin-bottom:0;padding-bottom:0}.su-card .su-card__contents>span{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;clear:both;display:block;font-size:.9em;font-weight:700;line-height:1.2;margin-bottom:.8rem;margin-top:0}@media only screen and (min-width:768px){.su-card .su-card__contents>span{margin-bottom:.9rem}}@media only screen and (min-width:1500px){.su-card .su-card__contents>span{margin-bottom:1rem}}.su-card .su-card__contents>span a{font-weight:700;text-decoration:none}.su-card .su-card__contents>span a:focus,.su-card .su-card__contents>span a:hover{text-decoration:underline}.su-card .su-card__contents>h2{font-size:1.5625em;letter-spacing:-.012em;margin-bottom:1.1rem}@media only screen and (min-width:768px){.su-card .su-card__contents>h2{margin-bottom:1.2rem}}@media only screen and (min-width:1500px){.su-card .su-card__contents>h2{margin-bottom:1.3rem}}.su-card .su-card__contents>h2>a{font-weight:700;-webkit-transition:color .3s ease-out;transition:color .3s ease-out}.su-card .su-card__contents>h2>a:focus,.su-card .su-card__contents>h2>a:hover{color:#b1040e;text-decoration:underline}.su-card .su-card__contents>div:not(.su-card__button){line-height:1.4}.su-card .su-card__contents>div:not(.su-card__button),.su-card .su-card__contents>p:last-of-type{margin-bottom:0}.su-card .su-card__contents>.su-link--action:not(:first-child),.su-card .su-card__contents>a:not(:first-child){display:inline-block;margin-top:1.1rem}@media only screen and (min-width:768px){.su-card .su-card__contents>.su-link--action:not(:first-child),.su-card .su-card__contents>a:not(:first-child){margin-top:1.2rem}}@media only screen and (min-width:1500px){.su-card .su-card__contents>.su-link--action:not(:first-child),.su-card .su-card__contents>a:not(:first-child){margin-top:1.3rem}}.su-card .su-card__button{margin-bottom:.8rem;margin-top:2rem}@media only screen and (min-width:768px){.su-card .su-card__button{margin-bottom:.9rem;margin-top:2.6rem}}@media only screen and (min-width:1500px){.su-card .su-card__button{margin-bottom:1rem;margin-top:2.7rem}}@media only screen and (min-width:0) and (max-width:575px){.su-card .su-card__button .su-button{width:auto}}.su-card a .su-media__wrapper img{-webkit-transition:-webkit-transform .3s ease-in-out;transition:-webkit-transform .3s ease-in-out;transition:transform .3s ease-in-out;transition:transform .3s ease-in-out,-webkit-transform .3s ease-in-out}.su-card a:focus .su-media__wrapper img,.su-card a:hover .su-media__wrapper img{-webkit-transform:scale(1.03);transform:scale(1.03)}.su-card--horizontal.su-card--link>a,.su-card--horizontal:not(.su-card--link){display:-ms-grid;display:grid;padding:3rem}@media only screen and (min-width:768px){.su-card--horizontal.su-card--link>a,.su-card--horizontal:not(.su-card--link){padding:3.6rem}}@media only screen and (min-width:1500px){.su-card--horizontal.su-card--link>a,.su-card--horizontal:not(.su-card--link){padding:3.8rem}}@media only screen and (min-width:0){.su-card--horizontal.su-card--link>a>*,.su-card--horizontal:not(.su-card--link)>*{margin-right:2.31rem}@supports (grid-column-gap:20px){.su-card--horizontal.su-card--link>a,.su-card--horizontal:not(.su-card--link){grid-column-gap:2.31rem}.su-card--horizontal.su-card--link>a>*,.su-card--horizontal:not(.su-card--link)>*{margin-left:0;margin-right:0}}}@media only screen and (min-width:576px){.su-card--horizontal.su-card--link>a>*,.su-card--horizontal:not(.su-card--link)>*{margin-right:2.31rem}@supports (grid-column-gap:20px){.su-card--horizontal.su-card--link>a,.su-card--horizontal:not(.su-card--link){grid-column-gap:2.31rem}.su-card--horizontal.su-card--link>a>*,.su-card--horizontal:not(.su-card--link)>*{margin-left:0;margin-right:0}}}@media only screen and (min-width:768px){.su-card--horizontal.su-card--link>a>*,.su-card--horizontal:not(.su-card--link)>*{margin-right:2.6rem}@supports (grid-column-gap:20px){.su-card--horizontal.su-card--link>a,.su-card--horizontal:not(.su-card--link){grid-column-gap:2.6rem}.su-card--horizontal.su-card--link>a>*,.su-card--horizontal:not(.su-card--link)>*{margin-left:0;margin-right:0}}}@media only screen and (min-width:992px){.su-card--horizontal.su-card--link>a>*,.su-card--horizontal:not(.su-card--link)>*{margin-right:2.6rem}@supports (grid-column-gap:20px){.su-card--horizontal.su-card--link>a,.su-card--horizontal:not(.su-card--link){grid-column-gap:2.6rem}.su-card--horizontal.su-card--link>a>*,.su-card--horizontal:not(.su-card--link)>*{margin-left:0;margin-right:0}}}@media only screen and (min-width:1200px){.su-card--horizontal.su-card--link>a>*,.su-card--horizontal:not(.su-card--link)>*{margin-right:2.6rem}@supports (grid-column-gap:20px){.su-card--horizontal.su-card--link>a,.su-card--horizontal:not(.su-card--link){grid-column-gap:2.6rem}.su-card--horizontal.su-card--link>a>*,.su-card--horizontal:not(.su-card--link)>*{margin-left:0;margin-right:0}}}@media only screen and (min-width:1500px){.su-card--horizontal.su-card--link>a>*,.su-card--horizontal:not(.su-card--link)>*{margin-right:2.74rem}@supports (grid-column-gap:20px){.su-card--horizontal.su-card--link>a,.su-card--horizontal:not(.su-card--link){grid-column-gap:2.74rem}.su-card--horizontal.su-card--link>a>*,.su-card--horizontal:not(.su-card--link)>*{margin-left:0;margin-right:0}}}@media only screen and (min-width:0){.su-card--horizontal.su-card--link>a,.su-card--horizontal:not(.su-card--link){-ms-grid-columns:100%;grid-template-columns:100%}.su-card--horizontal.su-card--link>a>:first-child,.su-card--horizontal:not(.su-card--link)>:first-child{-ms-grid-column:1}}@media only screen and (min-width:576px){.su-card--horizontal.su-card--link>a,.su-card--horizontal:not(.su-card--link){-ms-grid-columns:1fr 2fr;grid-template-columns:1fr 2fr}.su-card--horizontal.su-card--link>a>:first-child,.su-card--horizontal:not(.su-card--link)>:first-child{-ms-grid-column:1}.su-card--horizontal.su-card--link>a>:nth-child(2),.su-card--horizontal:not(.su-card--link)>:nth-child(2){-ms-grid-column:2}}@media only screen and (min-width:768px){.su-card--horizontal.su-card--link>a,.su-card--horizontal:not(.su-card--link){-ms-grid-columns:1fr 1fr;grid-template-columns:1fr 1fr}.su-card--horizontal.su-card--link>a>:first-child,.su-card--horizontal:not(.su-card--link)>:first-child{-ms-grid-column:1}.su-card--horizontal.su-card--link>a>:nth-child(2),.su-card--horizontal:not(.su-card--link)>:nth-child(2){-ms-grid-column:2}}.su-card--horizontal.su-card--link>a img,.su-card--horizontal:not(.su-card--link) img{-ms-grid-column:1;-ms-grid-row:1}.su-card--horizontal.su-card--link>a .su-card__contents,.su-card--horizontal:not(.su-card--link) .su-card__contents{-ms-grid-column:1;-ms-grid-row:2;padding:0}@media only screen and (min-width:576px){.su-card--horizontal.su-card--link>a .su-card__contents,.su-card--horizontal:not(.su-card--link) .su-card__contents{-ms-grid-column:2;-ms-grid-row:1;padding-left:0}}.su-card--icon,.su-card--icon-font{padding-top:3rem;text-align:center}@media only screen and (min-width:768px){.su-card--icon,.su-card--icon-font{padding-top:3.6rem}}@media only screen and (min-width:1500px){.su-card--icon,.su-card--icon-font{padding-top:3.8rem}}.su-card--icon .su-card__contents,.su-card--icon-font .su-card__contents{padding-top:1.5rem}@media only screen and (min-width:768px){.su-card--icon .su-card__contents,.su-card--icon-font .su-card__contents{padding-top:1.8rem}}@media only screen and (min-width:1500px){.su-card--icon .su-card__contents,.su-card--icon-font .su-card__contents{padding-top:1.9rem}}.su-card--icon-font.su-card--minimal,.su-card--icon.su-card--minimal{padding-top:0}.su-card--icon-font.su-card--horizontal,.su-card--icon.su-card--horizontal{text-align:left}@media only screen and (min-width:0) and (max-width:575px){.su-card--icon-font.su-card--horizontal>img,.su-card--icon.su-card--horizontal>img{display:none}}@media (min-width:576px){.su-card--icon-font.su-card--horizontal,.su-card--icon.su-card--horizontal{-ms-grid-columns:10rem 1fr;grid-template-columns:10rem 1fr}}.su-card--icon-font.su-card--horizontal .su-card__contents,.su-card--icon.su-card--horizontal .su-card__contents{padding-top:0}.su-card--icon img{margin-left:auto;margin-right:auto;max-width:10rem}@media only screen and (min-width:0) and (max-width:575px){.su-card--icon img{display:block}}.su-card--icon-font>span{display:block;font-size:5em;text-align:center}@media only screen and (min-width:0) and (max-width:575px){.su-card--icon-font.su-card--horizontal>span{font-size:3em;text-align:left}}.su-card--link{border:0;-webkit-box-shadow:none;box-shadow:none}.su-card--link>a{border:1px solid #e3e3e3;-webkit-box-shadow:0 3px 6px rgba(0,0,0,.13),0 3px 6px rgba(0,0,0,.1);box-shadow:0 3px 6px rgba(0,0,0,.13),0 3px 6px rgba(0,0,0,.1);color:#2e2d29;display:block;text-decoration:none}.su-card--link>a:focus,.su-card--link>a:hover{border:1px solid #c6c6c6;-webkit-box-shadow:0 10px 20px rgba(0,0,0,.15),0 6px 6px rgba(0,0,0,.2);box-shadow:0 10px 20px rgba(0,0,0,.15),0 6px 6px rgba(0,0,0,.2);-webkit-transition:-webkit-box-shadow .3s ease-out;transition:-webkit-box-shadow .3s ease-out;transition:box-shadow .3s ease-out;transition:box-shadow .3s ease-out,-webkit-box-shadow .3s ease-out}.su-card--link>a:focus h2,.su-card--link>a:hover h2{color:#b1040e;text-decoration:underline;-webkit-transition:color .3s ease-out;transition:color .3s ease-out}.su-card--link>a p{font-weight:400}.su-card--minimal{background-color:inherit;border:0;-webkit-box-shadow:none;box-shadow:none}@media only screen and (min-width:0) and (max-width:575px){.su-card--minimal .su-card__contents{padding-bottom:0;padding-left:0;padding-right:0}}@media only screen and (min-width:576px) and (max-width:767px){.su-card--minimal .su-card__contents{padding-bottom:0;padding-left:0;padding-right:0}}@media only screen and (min-width:768px) and (max-width:991px){.su-card--minimal .su-card__contents{padding-bottom:0;padding-left:0;padding-right:0}}@media only screen and (min-width:992px) and (max-width:1199px){.su-card--minimal .su-card__contents{padding-bottom:0;padding-left:0;padding-right:0}}@media only screen and (min-width:1200px) and (max-width:1499px){.su-card--minimal .su-card__contents{padding-bottom:0;padding-left:0;padding-right:0}}@media only screen and (min-width:1500px){.su-card--minimal .su-card__contents{padding-bottom:0;padding-left:0;padding-right:0}}.su-card--minimal:not(.su-card--icon) .su-card__contents{padding-top:2rem}@media only screen and (min-width:768px){.su-card--minimal:not(.su-card--icon) .su-card__contents{padding-top:2.6rem}}@media only screen and (min-width:1500px){.su-card--minimal:not(.su-card--icon) .su-card__contents{padding-top:2.7rem}}@media only screen and (min-width:0) and (max-width:575px){.su-card--minimal:not(.su-card--icon) .su-card__contents{padding-top:0}.su-card--minimal.su-card--horizontal{padding:0}}@media only screen and (min-width:576px) and (max-width:767px){.su-card--minimal.su-card--horizontal{padding:0}}@media only screen and (min-width:768px) and (max-width:991px){.su-card--minimal.su-card--horizontal{padding:0}}@media only screen and (min-width:992px) and (max-width:1199px){.su-card--minimal.su-card--horizontal{padding:0}}@media only screen and (min-width:1200px) and (max-width:1499px){.su-card--minimal.su-card--horizontal{padding:0}}@media only screen and (min-width:1500px){.su-card--minimal.su-card--horizontal{padding:0}}@media only screen and (min-width:0) and (max-width:575px){.su-card--minimal.su-card--horizontal .su-card__contents{padding-top:0}}@media only screen and (min-width:576px) and (max-width:767px){.su-card--minimal.su-card--horizontal .su-card__contents{padding-top:0}}@media only screen and (min-width:768px) and (max-width:991px){.su-card--minimal.su-card--horizontal .su-card__contents{padding-top:0}}@media only screen and (min-width:992px) and (max-width:1199px){.su-card--minimal.su-card--horizontal .su-card__contents{padding-top:0}}@media only screen and (min-width:1200px) and (max-width:1499px){.su-card--minimal.su-card--horizontal .su-card__contents{padding-top:0}}@media only screen and (min-width:1500px){.su-card--minimal.su-card--horizontal .su-card__contents{padding-top:0}}.su-card .media-entity-wrapper.video{position:relative}.su-card .media-entity-wrapper.video:before{content:"";display:block;padding-top:56.25%;width:100%}.su-card .media-entity-wrapper.video>img,.su-card .media-entity-wrapper.video>video{-o-object-fit:cover;object-fit:cover}.su-card .media-entity-wrapper.video>*{position:relative;z-index:5}.su-card .media-entity-wrapper.video>div{bottom:0;height:100%;left:0;position:absolute;width:100%;z-index:1}.su-card .media-entity-wrapper.video iframe.media-oembed-content{height:100%;min-height:unset;width:100%}.su-card .image figure,.su-card .image img{display:block}