website html

22
/* Resets --------------------------------------------------------- -----------------------*/ ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, body, html, p, blockquote, fieldset, input { margin: 0; padding: 0; } a img { border: 0; } a { text-decoration: none; outline: none; } input:focus, select:focus, textarea:focus, button:focus { outline: none; } /* General Styling and Structure --------------------------------------------------------- -----------------------*/ html { height: 100%; } body { min-height: 100%; font-family: 'Montserrat', sans-serif; font-size: 16px; font-weight:400; line-height: 2em; color: #415161; background-attachment: fixed;

Upload: danelle-hill

Post on 28-Dec-2015

38 views

Category:

Documents


0 download

DESCRIPTION

Education

TRANSCRIPT

Page 1: Website HTML

/* Resets--------------------------------------------------------------------------------*/

ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, body, html, p, blockquote, fieldset, input {

margin: 0;padding: 0;

}

a img {border: 0;

}

a {text-decoration: none;outline: none;

}

input:focus,select:focus,textarea:focus,button:focus { outline: none;}

/* General Styling and Structure--------------------------------------------------------------------------------*/html {

height: 100%;}

body {min-height: 100%;font-family: 'Montserrat', sans-serif;font-size: 16px;font-weight:400;line-height: 2em;color: #415161;background-attachment: fixed;background-image:url(main-bg.jpg);background-position: 50% 50%;

background-repeat: no-repeat; background-size: cover;

-webkit-font-smoothing: antialiased;}

.tall-header-page,

.short-header-page,

.no-header-page,

Page 2: Website HTML

.landing-page,

.title-page {background: #f9fafb;

}

.container {margin: 0 auto;width: 960px;

}

#header-wrap,#banner-wrap,#main-wrap,#footer-wrap{

width:100%;}

a {color: #546270;text-decoration:none;border-bottom: 1px dashed #546270;

}

/* remove bottom border from elements that only have an image as a child */.wsite-image > a,.wslide-link,.cloud-zoom,.imgPusher + span a{

border-bottom: none;}

a:hover {color: #546270;

}

h2 {font-size: 30px;padding: 15px 0 15px 0;line-height: 1.2;font-family: 'Montserrat', sans-serif;font-weight: 700;color: #415161;

}

p {padding: .5em 0;

}

Page 3: Website HTML

blockquote {background: #415161;font-family: 'Montserrat', sans-serif;font-size: 18px;font-style:normal !important;line-height: 32px;color: #fff;padding: 28px 40px !important;margin: 2em 0;border-left: 0px !important;

}

div#content {min-height:400px;}

.blog-title a {text-decoration:none;color:#788CAC;border-bottom:none;

}

.blog-title a:hover {color:#415161;

}

.blog-separator {border-bottom:1px solid #e6eaf0 !important;

}.blog-post .blog-content {

color:#788CAC;}

.blog-sidebar h2 {font-size:24px;

}

.blog-comments a {text-decoration:none;background:url(icon-bubble.png) no-repeat;padding-left:25px;line-height:20px;display:inline-block;border-bottom:none;

}

.imageGallery .galleryCaptionInnerText p, .imageGallery .galleryCaptionInnerText {

font-family: 'Montserrat Alternates', sans-serif;font-weight:700;

Page 4: Website HTML

}

.galleryCaptionHolderInnerBg {opacity: 0.2;

}

/* Header--------------------------------------------------------------------------------*/

#header-wrap {text-align:center;overflow:hidden;background:#fff;box-shadow: inset 0 0 0 1px rgba(0,0,0,.1);z-index: 20 !important;

}

#logo,#logo a {

font-family: 'Montserrat', sans-serif;font-size:50px;font-weight:700;line-height:60px;color:#415161;text-transform:uppercase;text-decoration:none;letter-spacing:-1px;margin:52px 0px 47px;border:none;

}

.splash-page #logo a {margin:20px 0px 44px;

}

/* HSocial Links--------------------------------------------------------------------------------*/.wsite-social {

vertical-align: middle;}

.wsite-social-item {width: 35px;height: 35px;margin: 0 0 0 3px;border-radius: 90%;border:none;

}

Page 5: Website HTML

.wsite-social-item:hover,

.wsite-social-item:active{background-color:#415161;

}

.wsite-social-rss { background: #8496b3 url(social-icons.png) no-repeat -214px -48px; }.wsite-social-linkedin { background: #8496b3 url(social-icons.png) no-repeat -121px -49px; }.wsite-social-facebook { background: #8496b3 url(social-icons.png) no-repeat -30px -49px; }.wsite-social-twitter { background: #8496b3 url(social-icons.png) no-repeat -76px -49px; }.wsite-social-mail { background: #8496b3 url(social-icons.png) no-repeat -168px -48px; }.wsite-social-pinterest { background: #8496b3 url(social-icons.png) no-repeat -352px -49px; }.wsite-social-youtube { background: #8496b3 url(social-icons.png) no-repeat -490px -49px; }.wsite-social-plus { background: #8496b3 url(social-icons.png) no-repeat -306px -49px; }.wsite-social-flickr { background: #8496b3 url(social-icons.png) no-repeat -260px -48px; }.wsite-social-vimeo { background: #8496b3 url(social-icons.png) no-repeat -398px -49px; }.wsite-social-yahoo { background: #8496b3 url(social-icons.png) no-repeat -443px -49px; }

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {

.wsite-social a span, .wsite-social a:active span {background-image: url([email protected]);

background-size:558px 134px;}

}

/* Navigation--------------------------------------------------------------------------------*/

#nav {clear: both;overflow: hidden;position: relative;

}

#nav ul {list-style: none;

Page 6: Website HTML

text-align:center;margin-bottom:15px;

}

#nav ul li {list-style: none;display:inline-block;margin:0px 21px;

}

#nav ul span:last-child li,#nav ul > li:last-child {

background: none;}

#nav ul li a {display: block;color: #b5c0d1;text-decoration: none;padding: 0px;border: 0;outline: 0;list-style-type: none;font-size: 18px;

}

#nav ul li#active a,#nav ul li a:hover {

color: #415161;border: 0;

}

/* Navigation Submenu's--------------------------------------------------------------------------------*/

#wsite-menus .wsite-menu li a {font-family: 'Montserrat', sans-serif;font-size:14px;color: #b5c0d1;background: #fff;border: 0;

}

#wsite-menus .wsite-menu li a:hover {color: #415161;background: #f9fafb;

}

#wsite-menus .wsite-menu-arrow {

Page 7: Website HTML

display: none;}

/* Page type: Tall header--------------------------------------------------------------------------------*/

.tall-header-page .wsite-background {width: 100%;height: 383px;background: url(banner-tall.jpg) no-repeat center center;background-size:cover;/* box-shadow: inset 0 0 0 1px rgba(0,0,0,.1); */

}

/* Page type: Short header--------------------------------------------------------------------------------*/

.short-header-page .wsite-background {width: 100%;height: 254px;background: url(banner-short.jpg) no-repeat center center;background-size:cover;/* box-shadow: inset 0 0 0 1px rgba(0,0,0,.1); */

}

/* Page type: No header--------------------------------------------------------------------------------*/

.no-header-page #header-wrap,

.splash-page #header-wrap{border-bottom:1px solid #ecedef;

}

/* Page type: Landing page--------------------------------------------------------------------------------*/

.landing-page #banner-wrap {background:#f9fafb;/* border-top:1px solid #e6e9eb; */border-bottom:1px solid #e6e9eb;text-align:center;height:382px;display:table;

}

.landing-page #banner-wrap .container {width:770px;

}

Page 8: Website HTML

.landing-page #banner-wrap .banner {display: table-cell;

vertical-align: middle;}

.landing-page #banner-wrap h2 {color: #415161;font-size: 32px;padding: 0px;

}

.landing-page #banner-wrap p {color: #8496b3;font-size: 18px;line-height:32px;margin: 35px 0;

}

.landing-page #banner-wrap .container > div {text-align: center !important;

}

/* Page type: Title page--------------------------------------------------------------------------------*/

.title-page #banner-wrap {background:#f9fafb;/* border-top:1px solid #e6e9eb; */border-bottom:1px solid #e6e9eb;text-align:center;height:111px;padding-top:38px;

}

.title-page #banner-wrap h2 {font-size: 32px;padding: 0px 0px 6px;

}

.title-page #banner-wrap p {margin-bottom:0px;color:#8496b3;padding:0px;

}

/* Splash Content--------------------------------------------------------------------------------*/

Page 9: Website HTML

.splash-page #wrapper {height: 100%;-moz-box-sizing: border-box;box-sizing: border-box;

}

#wrapper-inner {width: 100%;height: 100%;text-align: center;-moz-box-sizing: border-box;box-sizing: border-box;padding-top: 128px;padding-bottom: 128px;display: table;width: 910px;margin: 0 auto;

}

.splash-container{width: 910px;margin: 0 auto;text-align: center;margin-top: 0;vertical-align: middle;display: table-cell;

}

#splash-wrap {text-align: center;width: 910px; height: 418px; background-color: #f9fafa; -webkit-box-shadow: 0 10px 30px rgba(0,0,0,.1); -moz-box-shadow: 0 10px 30px rgba(0,0,0,.1); box-shadow: 0 10px 30px rgba(0,0,0,.1);margin:0px auto;overflow:hidden;

}

.splash-container p {margin-top:40px;color:#415161;

}

.splash-page #footer-wrap {display:none;

}

Page 10: Website HTML

/* Main Content--------------------------------------------------------------------------------*/

#main-wrap {background: #fff;

}

#main-wrap .container {min-height:400px;padding:53px 0px;

}

#main-wrap .container form .wsite-button {margin-top:20px;

}

/* Footer--------------------------------------------------------------------------------*/

#footer-wrap {text-align:right;border-top:1px solid #e6e9eb;padding:20px 0px;color:#415161;font-size:14px;

}

#footer-wrap .container h2 {font-size:16px;}

#footer-wrap .wsite-form-container {text-align:left;

}

/* Product page--------------------------------------------------------------------------------*/#wsite-com-product-social-sharing a,#wsite-com-product-social-sharing a:hover {

width: 35px;height: 35px;margin: 0 0 0 3px;border-radius: 90%;border:none;

}

#wsite-com-product-social-sharing a.wsite-com-product-social-rss { background: #8496b3 url(social-icons.png) no-repeat -214px -48px; }#wsite-com-product-social-sharing a.wsite-com-product-social-rss:hover { background-color:#415161; }

Page 11: Website HTML

#wsite-com-product-social-sharing a.wsite-com-product-social-rss:active { background-color:#415161; }

#wsite-com-product-social-sharing a.wsite-com-product-social-linkedin { background: #8496b3 url(social-icons.png) no-repeat -121px -49px; }#wsite-com-product-social-sharing a.wsite-com-product-social-linkedin:hover {background-color:#415161; }#wsite-com-product-social-sharing a.wsite-com-product-social-linkedin:active { background-color:#415161; }

#wsite-com-product-social-sharing a.wsite-com-product-social-facebook { background: #8496b3 url(social-icons.png) no-repeat -30px -49px; }#wsite-com-product-social-sharing a.wsite-com-product-social-facebook:hover { background-color:#415161; }#wsite-com-product-social-sharing a.wsite-com-product-social-facebook:active { background-color:#415161; }

#wsite-com-product-social-sharing a.wsite-com-product-social-twitter { background: #8496b3 url(social-icons.png) no-repeat -76px -49px; }#wsite-com-product-social-sharing a.wsite-com-product-social-twitter:hover { background-color:#415161; }#wsite-com-product-social-sharing a.wsite-com-product-social-twitter:active { background-color:#415161; }

#wsite-com-product-social-sharing a.wsite-com-product-social-mail { background: #8496b3 url(social-icons.png) no-repeat -168px -48px; }#wsite-com-product-social-sharing a.wsite-com-product-social-mail:hover { background-color:#415161; }#wsite-com-product-social-sharing a.wsite-com-product-social-mail:active { background-color:#415161; }

#wsite-com-product-social-sharing a.wsite-com-product-social-pinterest { background: #8496b3 url(social-icons.png) no-repeat -352px -49px; }#wsite-com-product-social-sharing a.wsite-com-product-social-pinterest:hover { background-color:#415161; }#wsite-com-product-social-sharing a.wsite-com-product-social-pinterest:active { background-color:#415161; }

#wsite-com-product-social-sharing a.wsite-com-product-social-youtube { background: #8496b3 url(social-icons.png) no-repeat -490px -49px; }#wsite-com-product-social-sharing a.wsite-com-product-social-youtube:hover { background-color:#415161; }#wsite-com-product-social-sharing a.wsite-com-product-social-youtube:active { background-color:#415161; }

#wsite-com-product-social-sharing a.wsite-com-product-social-plus { background: #8496b3 url(social-icons.png) no-repeat -306px -49px; }#wsite-com-product-social-sharing a.wsite-com-product-social-plus:hover { background-color:#415161; }

Page 12: Website HTML

#wsite-com-product-social-sharing a.wsite-com-product-social-plus:active { background-color:#415161; }

#wsite-com-product-social-sharing a.wsite-com-product-social-flickr { background: #8496b3 url(social-icons.png) no-repeat -260px -48px; }#wsite-com-product-social-sharing a.wsite-com-product-social-flickr:hover { background-color:#415161; }#wsite-com-product-social-sharing a.wsite-com-product-social-flickr:active { background-color:#415161; }

#wsite-com-product-social-sharing a.wsite-com-product-social-vimeo { background: #8496b3 url(social-icons.png) no-repeat -398px -49px; }#wsite-com-product-social-sharing a.wsite-com-product-social-vimeo:hover { background-color:#415161; }#wsite-com-product-social-sharing a.wsite-com-product-social-vimeo:active { background-color:#415161; }

#wsite-com-product-social-sharing a.wsite-com-product-social-yahoo { background: #8496b3 url(social-icons.png) no-repeat -443px -49px; }#wsite-com-product-social-sharing a.wsite-com-product-social-yahoo:hover { background-color:#415161; }#wsite-com-product-social-sharing a.wsite-com-product-social-yahoo:active { background-color:#415161; }

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {

#wsite-com-product-social-sharing a.wsite-com-product-social-rss,#wsite-com-product-social-sharing a.wsite-com-product-social-linkedin,#wsite-com-product-social-sharing a.wsite-com-product-social-facebook,#wsite-com-product-social-sharing a.wsite-com-product-social-twitter,#wsite-com-product-social-sharing a.wsite-com-product-social-mail,#wsite-com-product-social-sharing a.wsite-com-product-social-pinterest,#wsite-com-product-social-sharing a.wsite-com-product-social-youtube,#wsite-com-product-social-sharing a.wsite-com-product-social-plus,#wsite-com-product-social-sharing a.wsite-com-product-social-flickr,#wsite-com-product-social-sharing a.wsite-com-product-social-vimeo,#wsite-com-product-social-sharing a.wsite-com-product-social-yahoo {

background-image: url([email protected]); background-size:558px 134px;

}}

/* Form Customization--------------------------------------------------------------------------------*/

.wsite-form-label, .wsite-com-product-title {display: inline-block;

Page 13: Website HTML

font-weight:normal;}

.wsite-form-input, .wsite-search-element-input {font-family: 'Montserrat', sans-serif;font-size: 16px;color: #727f97;background: #fff;border: 1px solid #b0b6bd;padding: 10px !important;

}

.wsite-form-input:focus, .wsite-search-element-input:focus {border: 1px solid #415161;

}

.wsite-form-container .form-input-error { border: 1px solid #e96c6c !important;}

.form-field-error .weebly-form-radio-container, .form-field-error .wsite-form-radio-container {

border: none;}

.form-field-error .jqTransformCheckbox,

.form-field-error .jqTransformRadio{background-position: center bottom;

}

/* Custom Form: Radios */.jqTransformRadioWrapper {

float: left;display:block;margin:3px 10px 0 0;

}

.jqTransformRadio {background: transparent url(radio.png) no-repeat center top;vertical-align: middle;height: 25px;width: 25px;display:block;/*display: -moz-inline-block;*/border-bottom:none;

}

/* Custom Form: Checkboxes */span.jqTransformCheckboxWrapper{

display:block;

Page 14: Website HTML

float:left;margin:3px 10px 0px 0px;

}.jqTransformCheckbox {

background: transparent url(checkbox.png) no-repeat center top;vertical-align: middle;height: 25px;width: 21px;display:block;/*display: -moz-inline-block;*/border-bottom:none;

}

/* Custom Form: Checked - Used for both Radio and Checkbox */.form-field-error a.jqTransformChecked,a.jqTransformChecked { background-position: center -25px;}

/* Custom Form: Selects */.jqTransformSelectWrapper {

width: 395px !important;position:relative;height: 42px;background-color: #fff;border: 1px solid #c4c9d2;float:left;margin-bottom: 10px;

}

.jqTransformSelectWrapper div span {font-size: 16px;float: none;position: absolute;white-space: nowrap;height: 27px;line-height: 20px;padding: 10px 0 0 10px;overflow: hidden;cursor:pointer;color:#727F97;

}

.jqTransformSelectWrapper a.jqTransformSelectOpen {display: block;position: absolute;right: 1px;top:1px;width: 39px;height: 39px;background: url(select_right.png) no-repeat center center;border-bottom:none;

Page 15: Website HTML

}

.jqTransformSelectWrapper ul {position: absolute;width: 395px !important;top: 42px;left: -1px;list-style: none;background-color: #FFF;border: solid 1px #d5d8db;display: none;margin: 0px;padding: 0px;height: 150px;overflow: auto;overflow-y: auto;z-index:10;

}

.jqTransformSelectWrapper ul a {display: block;padding: 5px 16px;margin:0px;text-decoration: none;color:#727f97;background-color: #FFF;font-size: 16px;border-bottom:none;

}

.jqTransformSelectWrapper ul a.selected {background:#415161;color: #fff;

}

.jqTransformSelectWrapper ul a:active {background: #415161;color: #fff;

}

.jqTransformSelectWrapper ul a:hover, .jqTransformSelectWrapper ul a.selected:hover {

background: #f1f2f4;color: #727f97;

}

.jqTransformHidden {display: none;}

.jqTransformButton {display: none;}

Page 16: Website HTML

.jqTransformTextarea { display:block;height:105px;

}

/* Buttons--------------------------------------------------------------------------------*/

/* Small structure & regular style */

.wsite-button {display: inline-block;padding: 0px;background: #fff;border: none;transition: all 0.5s ease;

}

.wsite-button:hover {background:#727f97 ;color:#fff !important;

}

.wsite-button:active {background:#727f97 ;color:#fff !important;

}

.wsite-button-inner {color: #8496b3;font-family: 'Montserrat', sans-serif;display: block;font-size: 18px;font-weight: 400;padding: 4px 27px;background:#fff;border:1px solid #c4c9d2;transition: all 0.5s ease;

}

.wsite-button:hover .wsite-button-inner {background:#727f97 ;color:#fff !important;border:1px solid #727f97;

}

.wsite-button:active .wsite-button-inner {background:#727f97 ;color:#fff !important;

Page 17: Website HTML

border:1px solid #727f97;}

/* Large structure & regular style */

.wsite-button-large {display: inline-block;padding: 0px;background: #fff;border:none;transition: all 0.5s ease;

}

.wsite-button-large:hover {background:#727f97 ;color:#fff !important;

}

.wsite-button-large:active {background:#727f97 ;color:#fff !important;

}

.wsite-button-large .wsite-button-inner {color:#8496b3 !important;padding: 2px 57px;background: #fff;border:1px solid #c4c9d2;

}

.wsite-button-large:hover .wsite-button-inner {background:#727f97 ;color:#fff !important;border:1px solid #727f97;

}

.wsite-button-large:active .wsite-button-inner {background:#727f97 ;color:#fff !important;border:1px solid #727f97;

}

/* Highlighted styles */.wsite-button-highlight {

border:none;}

.wsite-button-highlight .wsite-button-inner {background:#fff;

Page 18: Website HTML

color:#5d7892 !important;border:1px solid #b0b6bd;

}

.wsite-button-highlight:hover {background:#415161 !important;

}

.wsite-button-highlight:hover .wsite-button-inner,

.wsite-button-large.wsite-button-highlight:hover .wsite-button-inner{background:#415161!important;color:#fff !important;border:1px solid #415161;

}

.wsite-button-highlight:active {background:#415161!important;

}

.wsite-button-highlight:active .wsite-button-inner,

.wsite-button-large.wsite-button-highlight:active .wsite-button-inner{background:#415161!important;color:#fff !important;border:1px solid #415161;

}

.wsite-button-large.wsite-button-highlight {background:none;

}

.wsite-button-large.wsite-button-highlight .wsite-button-inner {background:none;

}