Team:SMTexas/CSS.css

From 2014hs.igem.org

Revision as of 01:06, 4 April 2014 by VikReddy (Talk | contribs)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)

/***** BASE CSS *****/


/* Site Name */

  1. divSiteTitle {text-decoration:none;}
  1. divTagLine {text-decoration:none;}


/* Headline Text */

  1. divHeaderLine1 {display:inline-block !important}
  1. divHeaderLine2 {display:inline-block !important}
  1. divHeaderLine3 {display:inline-block !important}


/* Headings */

h3, h4, h5, h6 {line-height:1.5 !important}

.lead { 

   text-align:center;

}

.lead h2 { 

   font-size:33px;line-height:45px;

}

.lead h3 { 

   font-size:17px;

}

.lead h3 a { 

   font-size:inherit !important;

}


/* Contact */

ul#contact-info .icon {font-size:20px;float:left;line-height:25px;margin-right:10px;}

ul#contact-info .field {font-weight:bold;}

ul#contact-info {list-style:none;}


/* Grid */

  1. tiles li {

width:240px !important; background-color: #ffffff; border: 1px solid #dedede; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; padding: 10px !important; margin-right:7px;margin-bottom:7px;float:left; }

  1. tiles li img {margin-bottom:10px;}
  1. tiles li div.meta {color:#999;text-transform:uppercase;font-size:10px;margin:0;}
  1. tiles li h4 {line-height:1.5;margin:0 0 5px 0;}
  1. tiles li h4 a {line-height:inherit;margin:0;text-decoration:inherit;color:inherit;font-size:inherit;font-family:inherit;font-weight:inherit;font-style:inherit;}
  1. tiles li p {font-size:12px;line-height:1.5;margin:0;}
  1. tiles li a {font-size:12px;}
  1. tiles li .more_link {font-size:smaller;line-height:2;text-transform:uppercase;letter-spacing:2px;white-space:nowrap;display:block;margin: 5px 0 0 0;}
  1. tiles li blockquote {line-height:1.5;margin:0;padding:0;color:#999;border:none;font-size:150%;font-style:italic;font-family:Georgia, Times, serif;}
  1. tiles li blockquote small {font-size:11px;font-style:normal;}


/* Icons */

[class*="social foundicon-"]:before {font-family: "SocialFoundicons";}

[class*="general foundicon-"]:before {font-family: "GeneralFoundicons";}


/* Menu Side */

.menu_menu_simple ul {margin-top:0px;margin-bottom:0px;}

.menu_menu_simple ul li {margin-top:0px;margin-bottom:0px;}


/* Header Area */

  1. decorative1 {

margin-top:-2px;padding-top:2px; margin-left: -20px !important; margin-right: -20px !important; /* fix bg cover issue */ }


/* Menu Centered */

.centered_menu {text-align:center}

.centered_menu > div {display:inline-block;}

.centered_menu div {text-align:left}


/* Footer elements */

.social_bookmarks a {font-size:smaller !important;text-transform:uppercase;letter-spacing:1px;text-decoration:none;margin-right:20px;}

.copyright {font-size:smaller;letter-spacing:1px;}


/* Responsive Image */

img {max-width:100%;height:auto;width:auto;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;}

/* Responsive Video from Zurb Foundation. Copyright (c) 2011 ZURB, http://www.zurb.com/ License: MIT */

.flex-video {position:relative;padding-top:25px;padding-bottom:67.5%;height:0;margin-bottom:16px;overflow: hidden;}

.flex-video.widescreen {padding-bottom:57.25%;}

.flex-video.vimeo {padding-top:0;}

.flex-video iframe, .flex-video object, .flex-video embed {position:absolute;top:0;left:0;width:100%;height:100%;border:none;}

@media only screen and (max-device-width: 800px), only screen and (device-width: 1024px) and (device-height: 600px), only screen and (width: 1280px) and (orientation: landscape), only screen and (device-width: 800px), only screen and (max-width: 767px) { 

       .flex-video { padding-top: 0; }

   }


/* Additional */

  1. divBoxed {position:relative}

.nav-links > a {margin-right:20px;}

.btn-secondary, .btn-secondary:hover {text-shadow:none;}

  1. divHeaderLine1 a, #divHeaderLine2 a, #divHeaderLine3 a { 
   font-size: inherit;
   line-height: inherit;
   letter-spacing: inherit;
   font-family: inherit;
   text-shadow: inherit;
   font-weight: inherit;
   font-style: inherit;

}

  1. divHeaderLine1, #divHeaderLine2, #divHeaderLine3 { 
   padding-top:3px !important;
   padding-bottom:3px !important;
   text-align:inherit !important;

}

  1. decorative2 {/*opacity:0.95;*/ 
   -webkit-box-shadow: 0 1px 10px rgba(0, 0, 0, 0.03);
   -moz-box-shadow: 0 1px 10px rgba(0, 0, 0, 0.03);
   box-shadow: 0 1px 10px rgba(0, 0, 0, 0.03);

}

.showcase-tabs > li > a { 

   font-size: 14px;
   letter-spacing: 1px;
   padding-left: 20px;
   padding-right: 20px;

}

.cap1 div, .cap2 div, .cap3 div, .cap4 div, .cap5 div { 

   margin: 0 -1px;

}

.camera_wrap .camera_pag .camera_pag_ul li {margin:20px 5px 0px !important; }


/* Adjustments */

.search.adjust {margin-bottom:15px}

.divPanel {}

.divPanel.notop {padding-top:0px}

.divPanel.nobottom {padding-bottom:0px}


/***** BOOTSTRAP CSS BASE OVERRIDE *****/

.navbar .nav-pills > li > a {text-shadow:none;font-weight:normal;}

.navbar .dropdown-menu li > a {text-shadow:none;font-weight:normal;}

.navbar .nav-pills > li > .dropdown-menu:before {border:none;}

.navbar .nav-pills > li > .dropdown-menu:after {border:none;}

.navbar .nav-pills > .active > a, .navbar .nav-pills > .active > a:hover, .navbar .nav-pills > .active > a:focus {-webkit-box-shadow: none;box-shadow: none;}

.navbar .nav-pills > li > a:hover, .navbar .nav-pills li.dropdown.open.active > .dropdown-toggle {-webkit-transition: ease-in-out .2s;-moz-transition: ease-in-out .2s;-o-transition: ease-in-out .2s;-ms-transition: ease-in-out .2s; transition: ease-in-out .2s;}

.navbar .nav-pills .open .dropdown-toggle {background-color:transparent;}

.btn .caret {margin-top: 8px !important;}


body{background-image: none; background-position: initial initial; background-repeat: initial initial; }

  1. divLogo{margin-top: 9px; margin-bottom: 0px; margin-left: -3px;}
  1. divSiteTitle{font-family: 'Century Gothic', sans-serif; color: rgb(176, 42, 154); font-size: 28px; text-shadow: rgba(0, 0, 0, 0.2) 2px 5px 9px, rgba(255, 255, 255, 0.298039) 0px -5px 35px; line-height: 42px; letter-spacing: 2px; text-transform: uppercase; font-weight: normal; font-style: normal; padding-left: 0px; padding-right: 0px;}
  1. divTagLine {font-family: 'Century Gothic', sans-serif; font-size: 12px; text-transform: uppercase; letter-spacing: 5px; line-height: 22px; color: rgb(255, 255, 255); text-shadow: none; padding-left: 3px; padding-right: 3px; font-weight: normal; font-style: normal;}

.navContainer {margin-top: 0px; }

.navContainer .navMenu {}

.navContainer .navMenu li {background-color: rgb(245, 245, 245); border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; }

.navContainer .navMenu li a {}

.navContainer .navMenu li.current {background-color: rgb(174, 0, 0); }

.navContainer .navMenu li.current a {}

.camera_caption > div {opacity: 0.85;filter:alpha(opacity=85);opacity: 0.85;filter:alpha(opacity=85);}

.camera_prevThumbs, .camera_nextThumbs, .camera_prev, .camera_next, .camera_commands, .camera_thumbs_cont {opacity: 0.85;filter:alpha(opacity=85);opacity: 0.85;filter:alpha(opacity=85);}

.camera_wrap .camera_pag .camera_pag_ul li, .camera_wrap .camera_pag .camera_pag_ul li, .camera_wrap .camera_pag .camera_pag_ul li:hover > span {box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);}

.camera_wrap .camera_pag .camera_pag_ul li.cameracurrent > span {}

.camera_wrap {display: block; margin-bottom: 15px; height: 410px; border: 5px solid rgb(255, 255, 255); margin-left: -5px; -webkit-box-shadow: rgba(0, 0, 0, 0.294118) 0px 1px 4px; box-shadow: rgba(0, 0, 0, 0.294118) 0px 1px 4px; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; margin-top: 44px;}

.cap1 > div {opacity: 0.85;filter:alpha(opacity=85);opacity: 0.85; background-color: rgb(212, 173, 0); }

.cap2 > div {opacity: 0.85;filter:alpha(opacity=85);opacity: 0.85; background-color: rgb(212, 173, 0); }

.cap3 > div {opacity: 0.85;filter:alpha(opacity=85);opacity: 0.85;filter:alpha(opacity=85);}

.cap4 > div {opacity: 0.85;filter:alpha(opacity=85);opacity: 0.85;filter:alpha(opacity=85);}

.cap5 > div {opacity: 0.85;filter:alpha(opacity=85);opacity: 0.85;filter:alpha(opacity=85);}

h1 {font-family: 'Source Sans Pro', sans-serif; font-weight: normal; font-style: normal; font-size: 40px; line-height: 65px; margin-top: 0px; color: rgb(0, 0, 0);}

.page-content {line-height: 25px; font-family: 'Open Sans', sans-serif;}

.page-content a {color: rgb(164, 39, 143); font-family: 'Open Sans', sans-serif;}

.sidebox {-webkit-box-shadow:rgba(0, 0, 0, 0.298039) 0px 1px 3px;-moz-box-shadow:rgba(0, 0, 0, 0.298039) 0px 1px 3px;box-shadow:rgba(0, 0, 0, 0.298039) 0px 1px 3px;background-color:rgb(250, 250, 250);color:rgb(51, 51, 51);border-width:1px;border-style:solid;border-color:rgb(255, 255, 255);border-radius:3px;padding:18px;margin-top:28px;}

.sidebar {;}

.sidebox-title {line-height: 40px; font-weight: normal; font-style: normal; font-family: 'Source Sans Pro', sans-serif; color: rgb(51, 51, 51);}

.sidebox a {color: rgb(164, 39, 143);}

  1. decorative1 {position: relative; background-color: rgb(240, 240, 240); background-image: url(bright-lights-big-city.jpg); -webkit-background-size: cover; background-size: cover; background-position: 50% 50%; background-repeat: no-repeat no-repeat;

-webkit-box-shadow: 0px 3px 11px rgba(0, 0, 0, 0.7); -moz-box-shadow: 0px 3px 11px rgba(0, 0, 0, 0.7); box-shadow: 0px 3px 11px rgba(0, 0, 0, 0.7);}

  1. decorative2{background-color: rgb(61, 61, 61); height: 85px;}
  1. divFooter{font-family: 'Open Sans', sans-serif; background-color: rgb(0, 0, 0); color: rgb(255, 255, 255); padding-top: 32px; line-height: 22px; font-size: 12px; text-transform: none; background-image: none; background-repeat: repeat repeat;}
  1. divFooter a{color: rgb(164, 39, 143);}
  1. divFooter h3{color: rgb(255, 255, 255);}

h2 {font-weight: normal; font-style: normal; font-family: 'Source Sans Pro', sans-serif; font-size: 35px; line-height: 45px;}

.breadcrumbs {line-height: 80px; font-family: 'Open Sans', sans-serif;}

.breadcrumbs a {color: rgb(164, 39, 143); font-family: 'Open Sans', sans-serif;}

  1. divHeaderLine1{letter-spacing: 0px; word-spacing: 0px; margin-top: 0px; color: rgb(46, 46, 46); font-size: 50px; line-height: 64px; font-family: 'Source Sans Pro', sans-serif; text-transform: none; text-shadow: rgba(0, 0, 0, 0.14902) 0px 3px 5px, rgba(255, 255, 255, 0.298039) 0px -5px 35px; font-weight: normal; font-style: normal; text-align: center; background-color: rgb(255, 255, 255); opacity: 0.9; padding: 3px 10px;}
  1. divHeaderLine2 {font-size: 20px; line-height: 30px; letter-spacing: 1px; margin-top: 11px; font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; color: rgb(255, 255, 255); text-shadow: none; text-align: center; font-weight: normal; font-style: italic; background-color: rgb(0, 0, 0); opacity: 0.9; padding: 3px 10px; background-position: initial initial; background-repeat: initial initial;}
  1. divHeaderLine3{margin-top: 18px; color: rgb(0, 0, 0); text-align: center; line-height: 16px; text-transform: none; font-size: 15px;}

a.btn, a.btn-large, a.btn-small, a.btn-mini {color:#333} 

a.btn-info, a.btn-success, a.btn-warning, a.btn-danger, a.btn-inverse {color:#ffffff}

.btn-secondary, .btn-secondary:hover, a.btn-secondary, a.btn-secondary:hover {color:#323232;}

.btn-secondary {border:1px solid #dfdfdf;border-bottom:1px solid #afafaf;background-color:#fafafa;background-repeat: repeat-x;background-image:-webkit-gradient(linear, left top, left bottom, from(#fafafa), to(#e1e1e1));background-image:-webkit-linear-gradient(top, #fafafa, #e1e1e1);background-image:-moz-linear-gradient(top, #fafafa, #e1e1e1);background-image:-ms-linear-gradient(top, #fafafa, #e1e1e1);background-image:-o-linear-gradient(top, #fafafa, #e1e1e1);background-image:linear-gradient(top, #fafafa, #e1e1e1);filter: progid:dximagetransform.microsoft.gradient(startColorstr=#fafafa, endColorstr=#e1e1e1, GradientType=0);filter: progid:dximagetransform.microsoft.gradient(enabled=false);}

.btn-secondary:hover, .btn-secondary:active, .btn-secondary.active, .btn-secondary.disabled, .btn-secondary[disabled] {background-color:#dfdfdf;}

.btn-primary, .btn-primary:hover, a.btn-primary, a.btn-primary:hover {color:#ffffff;} 

.btn-primary {border:1px solid #9d2589;border-bottom:1px solid #7b1d6c;background-color:#b02a9a;background-repeat: repeat-x;background-image:-webkit-gradient(linear, left top, left bottom, from(#b02a9a), to(#9e268b));background-image:-webkit-linear-gradient(top, #b02a9a, #9e268b);background-image:-moz-linear-gradient(top, #b02a9a, #9e268b);background-image:-ms-linear-gradient(top, #b02a9a, #9e268b);background-image:-o-linear-gradient(top, #b02a9a, #9e268b);background-image:linear-gradient(top, #b02a9a, #9e268b);filter: progid:dximagetransform.microsoft.gradient(startColorstr=#b02a9a, endColorstr=#9e268b, GradientType=0);filter: progid:dximagetransform.microsoft.gradient(enabled=false);}

.btn-primary:hover, .btn-primary:active, .btn-primary.active, .btn-primary.disabled, .btn-primary[disabled] {background-color:#9d2589;}
  1. divHeaderText {padding-top: 200px; padding-bottom: 30px; border-color: rgb(51, 51, 51); text-align: left;}
  1. decorative1 {-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover;}
  1. contentOuterSeparator{margin-top: 0px; border-top-color: rgb(255, 255, 255); border-top-width: 0px; border-top-style: solid; margin-bottom: 25px; height: 0px; background-color: transparent;}
  1. footerOuterSeparator{margin-top: 55px; border-top-width: 0px; border-top-style: solid; border-top-color: rgb(95, 95, 95);}
  1. headerSeparator{margin-top: 7px; border-top-color: rgb(51, 51, 51); border-top-width: 0px; border-top-style: solid;}

h3,.page-content h3 a {font-weight: normal; font-style: normal; font-family: 'Source Sans Pro', sans-serif; font-size: 28px; line-height: 45px;}

h4,.page-content h4 a {font-weight: normal; font-style: normal; font-family: 'Source Sans Pro', sans-serif; font-size: 21px; line-height: 45px;}

h5,.page-content h5 a {font-weight: normal; font-style: normal; font-family: 'Source Sans Pro', sans-serif; font-size: 17px; line-height: 45px;}

h6,.page-content h6 a {font-weight: normal; font-style: normal; font-family: 'Source Sans Pro', sans-serif; font-size: 15px; line-height: 45px;}

.line-separator{border-top-width: 1px; border-top-style: solid; margin-top: 21px; margin-bottom: 21px; border-top-color: rgb(234, 234, 234); border-bottom-color: rgb(255, 255, 255); border-bottom-width: 1px; border-bottom-style: solid; }

  1. headerSeparator2{margin-top: 45px; margin-bottom: 18px; }
  1. divVideo{border: 7px solid rgb(255, 255, 255); margin-left: -5px; -webkit-box-shadow: rgba(0, 0, 0, 0.498039) 0px 15px 10px -10px, rgba(0, 0, 0, 0.298039) 0px 1px 4px; box-shadow: rgba(0, 0, 0, 0.498039) 0px 15px 10px -10px, rgba(0, 0, 0, 0.298039) 0px 1px 4px; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; margin-top: 36px; }

.nav .dropdown-toggle .caret {border-top-color:rgb(0, 0, 0);border-bottom-color:rgb(0, 0, 0);}

.nav .dropdown-toggle:hover .caret {border-top-color:rgb(0, 0, 0);border-bottom-color:rgb(0, 0, 0);}

.navbar .dropdown-menu, .dropdown-menu {background-color: rgb(54, 54, 54); border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px;}

.navbar .dropdown-menu li > a, .dropdown-menu li > a, .navbar .nav-pills .open .dropdown-toggle {color: rgb(255, 255, 255);}

.navbar .dropdown-menu li > a:hover, .navbar .dropdown-menu .active > a, .navbar .dropdown-menu .active > a:hover, .dropdown-menu li > a:hover, .dropdown-menu .active > a, .dropdown-menu .active > a:hover, .dropdown-menu li > a:focus, .dropdown-submenu:hover > a, .navbar .nav-pills .open a.dropdown-toggle:hover {filter:none;color:rgb(255, 255, 255);background-color:rgb(176, 42, 154);background-image:none}

.navbar .nav-pills > li > a {margin-left: 2px; margin-right: 2px; padding: 35px; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; color: rgb(255, 255, 255); border-bottom-style: none;}

.navbar .nav-pills > li > a:hover, .navbar .nav li.dropdown.open.active > .dropdown-toggle, .navbar .nav-pills > li > a:focus {color: rgb(255, 255, 255); background-color: rgb(176, 42, 154); border-bottom-style: none;}

.navbar .nav > .active > a, .navbar .nav > .active > a:hover, .navbar .nav li.dropdown.open > .dropdown-toggle, .navbar .nav li.dropdown.active > .dropdown-toggle {background:none}

.navbar .nav-pills > .active > a, .navbar .nav-pills > .active > a:hover, .navbar .nav-pills li.dropdown.open > .dropdown-toggle, .navbar .nav-pills li.dropdown.active > .dropdown-toggle {color: rgb(255, 255, 255); background-color: rgb(176, 42, 154); border-bottom-style: none;}

.navbar .ddmenu {margin-top:-2px;margin-bottom:0px}

.navbar .nav-pills li.dropdown > .dropdown-toggle .caret, .navbar .nav-pills li.dropdown.open > .dropdown-toggle .caret, .navbar .nav-pills li.dropdown.active > .dropdown-toggle .caret, .navbar .nav-pills li.dropdown.open.active > .dropdown-toggle .caret {border-top-color:rgb(255, 255, 255);border-bottom-color:rgb(255, 255, 255);}

.navbar .nav-pills li.dropdown > .dropdown-toggle:hover .caret {border-top-color:rgb(255, 255, 255);border-bottom-color:rgb(255, 255, 255);}

.navbar .nav-pills li.dropdown.active > .dropdown-toggle .caret {border-top-color:rgb(255, 255, 255);border-bottom-color:rgb(255, 255, 255);}

.dropdown-menu .sub-menu {left:100%;position:absolute;top:0;visibility:hidden;margin-top:-1px;}

.dropdown-menu li:hover .sub-menu {visibility:visible;}

.ddmenu.nav-pills li a {font-family: 'Source Sans Pro', sans-serif; font-size: 17px; text-shadow: none; line-height: 15px;}

.ddmenu .dropdown-menu li a {line-height: 29px; font-size: 15px; font-family: 'Source Sans Pro', sans-serif;}

  1. decorative2 {position:fixed;top:0;left:0;right:0;z-index:1032} 
body {padding-top:85px}

.lead h2 {font-size: 37px; line-height: 57px; font-family: 'Open Sans';}

.lead h3 {font-size: 21px; line-height: 31px;}

.dropdown-menu .sub-menu {left:100%;position:absolute;top:0;visibility:hidden;margin-top:-1px;} .dropdown-menu li:hover .sub-menu {visibility:visible;} .navbar .btn-navbar-highlight {display:none;width:100%}

  1. decorative2 {z-index:100 !important}

@media (max-width: 979px) { 

    #divLogo {margin-bottom:10px;}



   .navbar .btn-navbar-highlight {display:inline;padding:9px 14px;margin-top:15px;}

   .navbar {width:100%;}

   #divMenuRight {float:none}



   .dropdown-menu .sub-menu {left:0%;position:relative;top:0;visibility:visible;margin-top:3px;display:block}

   .dropdown-menu, .sub-menu {border-radius:5px !important;}

   .navbar .ddmenu {margin-top: 0px;margin-bottom: 0px;}



   /* Fixed Top */

   #decorative2 {position:static;  height:auto;}

   body {padding-top:0px}


}


@media (max-width: 767px) { 

   #divLogo {margin-top:10px;margin-bottom:10px;}

   #divSiteTitle {font-size: 25px;}



   #divHeaderText {margin:0px;padding:10px 0px;}
  
   #divHeaderLine1 {margin-top: 0px;}
    
   
   #divMenuRight {width:100%;margin-top: 0px;padding-top:0px}

   .ddmenu, .navbar .ddmenu {margin-top: 0px; margin-bottom: 0px;}

   .navbar .btn-navbar-highlight {padding:9px 14px;margin-top:0px;}

   .navbar {width:100%;margin-top: 0px;padding-top:0px}



   #decorative1, #decorative2, #decorative3 {margin-left:-20px;margin-right:-20px;padding-left:20px;padding-right:20px;}



   /* Fixed Top */

   #decorative2 {position:static}

   body {padding-top:0px}



   #divFooter {margin-left:-20px;margin-right:-20px;padding-left:20px;padding-right:20px;}
   
   #divBoxed > #divFooter {margin-left:0px;margin-right:0px;padding-left:0px;padding-right:0px;}



   body > #footerOuterSeparator, body > #contentOuterSeparator {margin-left:-20px;margin-right:-20px;}



   .headerArea, .topArea {padding:20px !important;}
/*only for templates without divBoxed*/



   #camera_wrap {margin-top:20px}

   #divVideo {margin-top:20px}



   .dropdown-menu .sub-menu {left:0%;position:relative;top:0;visibility:visible;margin-top:3px;display:block}

   .dropdown-menu, .sub-menu {border-radius:5px !important;}

   .navbar .ddmenu {margin-top: 0px;margin-bottom: 0px;}

}

Retrieved from "http://2014hs.igem.org/Team:SMTexas/CSS.css"