|
|
| (8 intermediate revisions by the same user not shown) |
| Line 1: |
Line 1: |
| − | /*
| + | <html> |
| − | Author: W3layout
| + | |
| − | Author URL: http://w3layouts.com
| + | |
| − | License: Creative Commons Attribution 3.0 Unported
| + | |
| − | License URL: http://creativecommons.org/licenses/by/3.0/
| + | |
| − | */
| + | |
| − | /* reset */
| + | |
| − | html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,dl,dt,dd,ol,nav ul,nav li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;} | + | |
| − | article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section {display: block;}
| + | |
| − | ol,ul{list-style:none;margin:0;padding:0;}
| + | |
| − | blockquote,q{quotes:none;}
| + | |
| − | blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
| + | |
| − | table{border-collapse:collapse;border-spacing:0;}
| + | |
| − | /* start editing from here */
| + | |
| − | a{text-decoration:none;}
| + | |
| − | .txt-rt{text-align:right;}/* text align right */
| + | |
| − | .txt-lt{text-align:left;}/* text align left */
| + | |
| − | .txt-center{text-align:center;}/* text align center */
| + | |
| − | .float-rt{float:right;}/* float right */
| + | |
| − | .float-lt{float:left;}/* float left */
| + | |
| − | .clear{clear:both;}/* clear float */
| + | |
| − | .pos-relative{position:relative;}/* Position Relative */
| + | |
| − | .pos-absolute{position:absolute;}/* Position Absolute */
| + | |
| − | .vertical-base{ vertical-align:baseline;}/* vertical align baseline */
| + | |
| − | .vertical-top{ vertical-align:top;}/* vertical align top */
| + | |
| − | .underline{ padding-bottom:5px; border-bottom: 1px solid #eee; margin:0 0 20px 0;}/* Add 5px bottom padding and a underline */
| + | |
| − | nav.vertical ul li{ display:block;}/* vertical menu */
| + | |
| − | nav.horizontal ul li{ display: inline-block;}/* horizontal menu */
| + | |
| − | img{max-width:100%;}
| + | |
| − | /*end reset*/
| + | |
| − | body {
| + | |
| − | font-family: 'Source Sans Pro', sans-serif;
| + | |
| − | font-size: 100%;
| + | |
| − | background: #ffffff;
| + | |
| − | }
| + | |
| − | .wrap{
| + | |
| − | margin:0 auto;
| + | |
| − | width:80%;
| + | |
| − | }
| + | |
| − | /* start header */
| + | |
| − | .header_bg{
| + | |
| − | background: #000000;
| + | |
| − | }
| + | |
| − | .header{
| + | |
| − | padding: 2%;
| + | |
| − | }
| + | |
| − | .logo{
| + | |
| − | float: left;
| + | |
| − | }
| + | |
| − | /* start h_menu */
| + | |
| − | .header_bottom_right{
| + | |
| − | float:right;
| + | |
| − | }
| + | |
| − | .h_menu4 {
| + | |
| − | float: right;
| + | |
| − | margin-top: 4px;
| + | |
| − | }
| + | |
| − | .toggleMenu {
| + | |
| − | display: none;
| + | |
| − | background:#ff530d;
| + | |
| − | width: 100%;
| + | |
| − | color: #FFF;
| + | |
| − | font-size: 1.5em;
| + | |
| − | }
| + | |
| | | | |
| − | .nav {
| + | <style> |
| − | list-style: none;
| + | |
| − | margin-top: 0.5em;
| + | |
| − | }
| + | |
| − | .nav:before,
| + | |
| − | .nav:after {
| + | |
| − | content: " ";
| + | |
| − | display: table;
| + | |
| − | }
| + | |
| − | .nav:after {
| + | |
| − | clear: both;
| + | |
| − | }
| + | |
| − | .nav ul {
| + | |
| − | list-style: none;
| + | |
| − | width: 13em;
| + | |
| − | z-index:888;
| + | |
| − | }
| + | |
| − | .nav li a {
| + | |
| − | display: block;
| + | |
| − | padding: 10px 15px;
| + | |
| − | color: #C4C4C4;
| + | |
| − | font-size: 1.1em;
| + | |
| − | text-transform: uppercase;
| + | |
| − | font-weight: 400;
| + | |
| − | -webkit-transition: all 0.3s ease-out;
| + | |
| − | -moz-transition: all 0.3s ease-out;
| + | |
| − | -ms-transition: all 0.3s ease-out;
| + | |
| − | -o-transition: all 0.3s ease-out;
| + | |
| − | transition: all 0.3s ease-out;
| + | |
| − | text-decoration: none;
| + | |
| − | }
| + | |
| − | .nav li{
| + | |
| − |
| + | |
| − | }
| + | |
| − | .nav li a:hover {
| + | |
| − | color:#fff;
| + | |
| − | }
| + | |
| | | | |
| − | .nav li {
| + | /********************************* DEFAULT WIKI SETTINGS ********************************/ |
| − | position: relative;
| + | |
| − | }
| + | #sideMenu {display:none;} |
| − | .nav li a.active{
| + | #top_title {text-align:center;} |
| − | color:#fff; | + | #content { padding:0px; width:100%; margin-top:-7px; margin-left:0px;} |
| − | }
| + | body {background-color:white; } |
| − | .nav > li > a.parent{
| + | #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; } |
| − | }
| + | |
| − | .nav > li > a.root{
| + | |
| − | }
| + | /********************************* MENU ********************************/ |
| − | .nav > li > a.root:hover{
| + | /* Wrapper for the menu */ |
| − | }
| + | .menu_wrapper { |
| − | .nav > li > a.parent:hover{
| + | width:150px; |
| − | }
| + | height:100vh; |
| − | .nav > li {
| + | position:fixed; |
| − | float:left;
| + | padding:0px; |
| − |
| + | float:left; |
| − | } | + | background-color:#f2f2f2; |
| − | .nav > li.hover > ul {
| + | text-align:left; |
| − | left:-1px;
| + | |
| − | top:40px;
| + | |
| − | } | + | |
| − | .nav li li.hover ul {
| + | |
| − | left: 100%;
| + | |
| − | -webkit-transition: background .2s linear;
| + | |
| − | -moz-transition: background .2s linear; | + | |
| − | -ms-transition: background .2s linear;
| + | |
| − | -o-transition: background .2s linear;
| + | |
| − | transition: background .2s linear;
| + | |
| − | }
| + | |
| − | .nav > li > li > a{
| + | |
| − | font-size: 0.85em;
| + | |
| − | padding: 10px 20px;
| + | |
| − | display: block;
| + | |
| − | color: #555;
| + | |
| − | background: #fff;
| + | |
| − | position: relative;
| + | |
| − | z-index: 9999;
| + | |
| − | font-weight: normal;
| + | |
| − | -webkit-transition: all 0.3s ease-out;
| + | |
| − | -moz-transition: all 0.3s ease-out;
| + | |
| − | -ms-transition: all 0.3s ease-out;
| + | |
| − | -o-transition: all 0.3s ease-out;
| + | |
| − | transition: all 0.3s ease-out;
| + | |
| − | width: 100%;
| + | |
| − | text-decoration: none;
| + | |
| − | margin: 0;
| + | |
| − | text-transform: lowercase;
| + | |
| − | } | + | |
| − | .nav li li {
| + | |
| − | border-top:none;
| + | |
| − | } | + | |
| − | .nav li li:hover{
| + | |
| − | border-top:none; | + | |
| − | }
| + | |
| − | .nav li li a{
| + | |
| − | border-bottom: 1px solid rgb(34, 33, 33);
| + | |
| − | text-transform: uppercase;
| + | |
| − | font-family: 'Source Sans Pro', sans-serif;
| + | |
| − | color: #ffffff;
| + | |
| − | font-size: 14px;
| + | |
| − | background: #000000;
| + | |
| − | padding: 12px;
| + | |
| − | display: block;
| + | |
| − | -webkit-transition: 0.9s;
| + | |
| − | -moz-transition: 0.9s;
| + | |
| − | -o-transition: 0.9s;
| + | |
| − | transition: 0.9s;
| + | |
| − | }
| + | |
| − | .nav li li a:hover{ | + | |
| − | background: #FFFFFF;
| + | |
| − | color: #000000;
| + | |
| − | }
| + | |
| − | .nav > li > ul {
| + | |
| − | position: absolute;
| + | |
| − | left: -9999px;
| + | |
| − | padding: 0;
| + | |
| − | z-index: 9999;
| + | |
| − | background:#fff;
| + | |
| − | }
| + | |
| − | /***** Media Quries *****/
| + | |
| − | @media screen and (max-width: 800px) {
| + | |
| − | .h_logo4{
| + | |
| − | text-align:center; | + | |
| − | float: none;
| + | |
| − | margin: 4% 0;
| + | |
| | } | | } |
| − | .toggleMenu { | + | |
| − | padding: 5px 23px; | + | /* styling for the menu items */ |
| − | width: 100%; | + | .menu_item { |
| − | display:block; | + | width:100%; |
| | + | margin:-2px 0px 0px -20px; |
| | + | padding: 10px 10px; |
| | + | border-bottom: 1px solid #d3d3d3; |
| | + | font-weight:bold; |
| | + | color:#000000; |
| | + | cursor: pointer; |
| | } | | } |
| − | a.toggleMenu{
| + | |
| − | padding: 5px 0px;
| + | /* when hovering on a menu item */ |
| − | color: #fff;
| + | .menu_item:hover { |
| − | font-size: 22px;
| + | color:#000000; |
| − | font-weight: 400;
| + | background-color: #72c9b6; |
| − | text-decoration: none;
| + | |
| − | text-align: center;
| + | |
| | } | | } |
| − | .nav {
| + | |
| − | margin-top: 0;
| + | /* decoration icon for the menu buttons*/ |
| − | } | + | .icon { |
| − | .nav li a { | + | float:right; |
| − | padding: 10px 15px;
| + | font-size:16px; |
| − | background-color: #453E3E;
| + | font-weight:bold; |
| − | }
| + | |
| − | .nav {
| + | |
| − | background:#fff;
| + | |
| − | width: 100%;
| + | |
| − | }
| + | |
| − | .active {
| + | |
| − | display: block;
| + | |
| − | }
| + | |
| − | .nav > li {
| + | |
| − | float: none;
| + | |
| − | }
| + | |
| − | .nav > li > .parent {
| + | |
| − | background-position: 95% 50% !important;
| + | |
| − | }
| + | |
| − | .nav ul {
| + | |
| − | display: block;
| + | |
| − | width: 100%;
| + | |
| − | }
| + | |
| − | .nav > li.hover > ul , .nav li li.hover ul {
| + | |
| − | position: static;
| + | |
| − | }
| + | |
| − | .header_bottom_right {
| + | |
| − | float: right; | + | |
| − | width: 77%; | + | |
| − | text-align: center;
| + | |
| − | }
| + | |
| − | .h_menu4 {
| + | |
| − | width: 40%;
| + | |
| − | }
| + | |
| − | .toggleMenu{
| + | |
| − | background-color: #202227; | + | |
| | } | | } |
| | | | |
| − | .h_menu4 {
| + | /* this is the icon for when the content is collapsed */ |
| − | float: right; | + | .plus::before { |
| − | margin-top: 15px; | + | content: "+"; |
| − | }
| + | |
| − | }
| + | |
| − | @media screen and (max-width: 640px) {
| + | |
| − | .toggleMenu {
| + | |
| − | width:100%; | + | |
| | } | | } |
| − | }
| + | /* this is the icon for when the content is expanded */ |
| − | @media screen and (max-width: 480px) {
| + | .less::before { |
| − | .toggleMenu { | + | content: "иC"; |
| − | width:100%;
| + | } |
| − | }
| + | |
| − | }
| + | |
| − | @media screen and (max-width: 320px) {
| + | |
| − | .toggleMenu {
| + | |
| − | width:100%; | + | |
| − | } | + | |
| − | .h_menu4 {
| + | |
| − | width: 100%;
| + | |
| − | float:none;
| + | |
| − | }
| + | |
| − | .nav {
| + | |
| − | width: 100%;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | /* start main */
| + | |
| − | .main_bg{
| + | |
| − | background: #ffffff;
| + | |
| − | } | + | |
| | | | |
| − | .main {
| + | /* styling for the ul that creates the buttons */ |
| − | padding: 2%; | + | ul.menu_items { |
| − | }
| + | width:100%; |
| − | .grids_1_of_3{
| + | margin-left:0px; |
| − | padding: 6% 2%;
| + | padding:0px; |
| − | text-align:center;
| + | list-style: none; |
| − | }
| + | |
| − | .grid_1_of_3{
| + | |
| − | display: block;
| + | |
| − | float:left;
| + | |
| − | margin-left: 4%;
| + | |
| − | }
| + | |
| − | .grid_1_of_3:first-child {
| + | |
| − | margin-left: 0;
| + | |
| − | }
| + | |
| − | .images_1_of_3 {
| + | |
| − | width: 30.333%;
| + | |
| − | }
| + | |
| − | .images_1_of_3 img{
| + | |
| − | border-radius: 50%;
| + | |
| − | -webkit-border-radius: 50%;
| + | |
| − | -moz-border-radius: 50%;
| + | |
| − | -o-border-radius: 50%;
| + | |
| − | }
| + | |
| − | .images_1_of_3 h3{
| + | |
| − | color: #000000;
| + | |
| − | text-transform: uppercase;
| + | |
| − | margin-top: 0.8em;
| + | |
| − | margin-bottom: 0.4em;
| + | |
| − | font-size: 2em;
| + | |
| − | font-weight: normal;
| + | |
| − | font-family: 'Source Sans Pro', sans-serif;
| + | |
| − | line-height: 1.8em;
| + | |
| − | -webkit-text-stroke: 2px;
| + | |
| − | letter-spacing: 1px;
| + | |
| − | -webkit-transition: 0.9s;
| + | |
| − | -moz-transition: 0.9s;
| + | |
| − | -o-transition: 0.9s;
| + | |
| − | transition: 0.9s;
| + | |
| − | }
| + | |
| − | .images_1_of_3 h3:hover{
| + | |
| − | color: #febd17;
| + | |
| − | }
| + | |
| − | .images_1_of_3 p {
| + | |
| − | color: #000000;
| + | |
| − | line-height: 1.8em;
| + | |
| − | font-family: 'Source Sans Pro', sans-serif;
| + | |
| − | font-size: 1em;
| + | |
| − | }
| + | |
| − | /* start top_mid_bg */ | + | |
| − | .top_grid_bg{
| + | |
| − | background: url('../images/bg1.jpg') no-repeat; | + | |
| − | background-size: 100%;
| + | |
| − | }
| + | |
| − | .top_grid{
| + | |
| − | padding:6% 2%;
| + | |
| − | }
| + | |
| − | .top_grid_text{
| + | |
| − | float: left;
| + | |
| − | }
| + | |
| − | .top_grid_text h2{
| + | |
| − | color: #ffffff;
| + | |
| − | text-transform: capitalize;
| + | |
| − | font-size: 2em;
| + | |
| − | font-weight: normal;
| + | |
| − | font-family: 'Source Sans Pro', sans-serif;
| + | |
| − | letter-spacing: 1px;
| + | |
| − | }
| + | |
| − | .top_grid_btn{
| + | |
| − | float:right;
| + | |
| − | }
| + | |
| − | .top_grid_btn .btn{
| + | |
| − | padding: 12px 30px;
| + | |
| − | border: 1px solid #ffffff;
| + | |
| − | display: block;
| + | |
| − | font-size: 1em;
| + | |
| − | text-transform: uppercase;
| + | |
| − | color: #ffffff;
| + | |
| − | -webkit-transition: 0.9s;
| + | |
| − | -moz-transition: 0.9s;
| + | |
| − | -o-transition: 0.9s;
| + | |
| − | transition: 0.9s;
| + | |
| − | }
| + | |
| − | .top_grid_btn .btn:hover{
| + | |
| − | background: #ffffff;
| + | |
| − | color:#000000;
| + | |
| − | }
| + | |
| − | /* top_grid_portolio */
| + | |
| − | .top_grid_gallery{
| + | |
| − | margin-top: 4%;
| + | |
| − | }
| + | |
| − | .top_grid_portfoli{
| + | |
| − | margin-right: 3.6666666%;
| + | |
| − | }
| + | |
| − | .da-thumbs li ,.da-thumbs li img {
| + | |
| − | display: block;
| + | |
| − | position: relative;
| + | |
| − | }
| + | |
| − | .da-thumbs li {
| + | |
| − | overflow: hidden;
| + | |
| − | }
| + | |
| − | .da-thumbs li article {
| + | |
| − | position: absolute;
| + | |
| − | background-image:url(../images/image_hover.png);
| + | |
| − | background-repeat:repeat;
| + | |
| − | width: 100%;
| + | |
| − | height: 100%;
| + | |
| − | }
| + | |
| − | .da-thumbs li article.da-animate {
| + | |
| − | -webkit-transition: all 0.2s ease;
| + | |
| − | -moz-transition: all 0.2s ease-in-out;
| + | |
| − | -o-transition: all 0.2s ease-in-out;
| + | |
| − | -ms-transition: all 0.2s ease-in-out;
| + | |
| − | transition: all 0.2s ease-in-out;
| + | |
| − | }
| + | |
| − | /* Initial state classes: */
| + | |
| − | .da-slideFromTop {
| + | |
| − | left: 0px;
| + | |
| − | top: -100%;
| + | |
| − | }
| + | |
| − | .da-slideFromBottom {
| + | |
| − | left: 0px;
| + | |
| − | top: 100%;
| + | |
| − | }
| + | |
| − | .da-slideFromLeft {
| + | |
| − | top: 0px;
| + | |
| − | left: -100%;
| + | |
| − | }
| + | |
| − | .da-slideFromRight {
| + | |
| − | top: 0px;
| + | |
| − | left: 100%;
| + | |
| − | }
| + | |
| − | /* Final state classes: */
| + | |
| − | .da-slideTop {
| + | |
| − | top: 0px;
| + | |
| − | }
| + | |
| − | .da-slideLeft {
| + | |
| − | left: 0px;
| + | |
| − | }
| + | |
| − | .da-thumbs li article a {
| + | |
| − | color:#fff;
| + | |
| − | padding:20px;
| + | |
| − | display:block;
| + | |
| − | }
| + | |
| − | .da-thumbs {
| + | |
| − | text-align:center;
| + | |
| − | }
| + | |
| − | .da-thumbs li article h3{
| + | |
| − | color:#fff;
| + | |
| − | font-size:1.5em;
| + | |
| − | text-transform:capitalize;
| + | |
| − | padding: 80px 0 20px 0;
| + | |
| − | }
| + | |
| − | .da-thumbs li article em{
| + | |
| − | margin-bottom:10px;
| + | |
| − | color:#fff;
| + | |
| − | display:block;
| + | |
| − | }
| + | |
| − | .da-thumbs li article span{
| + | |
| − | display:inline-block;
| + | |
| − | }
| + | |
| − | span.link_post{
| + | |
| − | display:block;
| + | |
| − | width:35px;
| + | |
| − | height:35px;
| + | |
| − | background-color:#febd17;
| + | |
| − | cursor:pointer;
| + | |
| − | background-image:url(../images/link_post_icon.png);
| + | |
| − | background-repeat:no-repeat;
| + | |
| − | background-position:center;
| + | |
| − | margin-right:10px;
| + | |
| − | border-radius:4px;
| + | |
| − | -webkit-border-radius:4px;
| + | |
| − | -moz-border-radius:4px;
| + | |
| − | -o-border-radius:4px;
| + | |
| − | }
| + | |
| − | span.zoom{
| + | |
| − | overflow:hidden;
| + | |
| − | display:block;
| + | |
| − | width:35px;
| + | |
| − | height:35px;
| + | |
| − | background-color:#febd17;
| + | |
| − | cursor:pointer;
| + | |
| − | background-image:url(../images/zoom_icon.png);
| + | |
| − | background-repeat:no-repeat;
| + | |
| − | background-position:center;
| + | |
| − | margin-left:10px;
| + | |
| − | border-radius:4px;
| + | |
| − | -webkit-border-radius:4px;
| + | |
| − | -moz-border-radius:4px;
| + | |
| − | -o-border-radius:4px;
| + | |
| − | }
| + | |
| − | .portfolio_2col article h3{
| + | |
| − | padding-top:70px !important;
| + | |
| − | }
| + | |
| − | /* Image Grid */
| + | |
| − | .image_grid {
| + | |
| − | float:left;
| + | |
| − | overflow:hidden;
| + | |
| − | position:relative;
| + | |
| − | }
| + | |
| − | .image_grid li{
| + | |
| − | float: left;
| + | |
| − | line-height: 18px;
| + | |
| − | color: #686f74;
| + | |
| − | list-style:none;
| + | |
| − | overflow:hidden;
| + | |
| − | text-align:center;
| + | |
| − | }
| + | |
| − | /* start mid_grid_bg */
| + | |
| − | .mid_grid_bg{
| + | |
| − | background:#ffffff;
| + | |
| − | }
| + | |
| − | .mid_grid{
| + | |
| − | padding: 6% 2%;
| + | |
| − | }
| + | |
| − | .mid_grid h2{
| + | |
| − | color: #202227;
| + | |
| − | text-transform: capitalize;
| + | |
| − | font-size: 2.5em;
| + | |
| − | -webkit-text-stroke: 2px;
| + | |
| − | letter-spacing: 1px;
| + | |
| − | }
| + | |
| − | .mid_grid h3{
| + | |
| − | color: #777777;
| + | |
| − | text-transform: capitalize;
| + | |
| − | font-size: 1.5em;
| + | |
| − | margin: 2% 0;
| + | |
| − | }
| + | |
| − | .mid_grid h3 a{
| + | |
| − | color: #202227;
| + | |
| − | text-transform: uppercase;
| + | |
| − | }
| + | |
| − | .mid_grid h3 a:hover{
| + | |
| − | color: #555555;
| + | |
| − | }
| + | |
| − | .mid_grid .btn{
| + | |
| − | margin-top:8px;
| + | |
| − | padding: 12px 30px;
| + | |
| − | border: 1px solid #ffffff;
| + | |
| − | background:#202227;
| + | |
| − | display: inline-block;
| + | |
| − | font-size: 1em;
| + | |
| − | text-transform: uppercase;
| + | |
| − | color: #ffffff;
| + | |
| − | -webkit-transition: 0.9s;
| + | |
| − | -moz-transition: 0.9s;
| + | |
| − | -o-transition: 0.9s;
| + | |
| − | transition: 0.9s;
| + | |
| − | }
| + | |
| − | .mid_grid .btn:hover{
| + | |
| − | background: #000000;
| + | |
| − | }
| + | |
| − | .mid_grid_left{
| + | |
| − | float:left;
| + | |
| − | width: 56.333333%;
| + | |
| − | margin-right: 4%;
| + | |
| − | }
| + | |
| − | .mid_grid_right{
| + | |
| − | float:right;
| + | |
| − | width:38.333333%;
| + | |
| − | }
| + | |
| − | /* start btm_grid */
| + | |
| − | .btm_grid_bg{
| + | |
| − | background: url('../images/bg2.jpg') no-repeat;
| + | |
| − | background-size: cover;
| + | |
| − | -webkit-background-size: cover;
| + | |
| − | -moz-background-size: cover;
| + | |
| − | -o-background-size: cover;
| + | |
| − | }
| + | |
| − | .btm_grid{
| + | |
| − | padding:6% 2%;
| + | |
| − | }
| + | |
| − | .btm_grid h2 {
| + | |
| − | color: #ffffff;
| + | |
| − | text-transform: capitalize;
| + | |
| − | font-size: 2em;
| + | |
| − | letter-spacing: 1px;
| + | |
| − | }
| + | |
| − | .btm_grid h3{
| + | |
| − | color: #ffffff;
| + | |
| − | text-transform: uppercase;
| + | |
| − | font-size: 1em;
| + | |
| − | margin: 8% 0 4%;
| + | |
| − | -webkit-transition: 0.9s;
| + | |
| − | -moz-transition: 0.9s;
| + | |
| − | -o-transition: 0.9s;
| + | |
| − | transition: 0.9s;
| + | |
| − | }
| + | |
| − | .btm_grid h3:hover{
| + | |
| − | color: rgba(255, 255, 255, 0.69);
| + | |
| − | }
| + | |
| − | .btm_grid p{
| + | |
| − | margin-top:10%;
| + | |
| − | color: rgba(255, 255, 255, 0.69);
| + | |
| − | line-height: 1.6em;
| + | |
| − | font-size: 1em;
| + | |
| − | }
| + | |
| − | .span_of_3 {
| + | |
| − | margin-top: 3%;
| + | |
| − | }
| + | |
| − | .span1_of_3 {
| + | |
| − | width: 30.3333%;
| + | |
| − | float: left;
| + | |
| − | margin-right: 4%;
| + | |
| − | }
| + | |
| − | .span1_of_3:nth-child(3){
| + | |
| − | margin-right: 0;
| + | |
| − | }
| + | |
| − | .span_of_3 h3.style{
| + | |
| − | opacity: 0.5;
| + | |
| − | }
| + | |
| − | .span_of_3 h4{
| + | |
| − | position: relative;
| + | |
| − | display: inline-block;
| + | |
| − | }
| + | |
| − | .span_of_3 h4.divider{
| + | |
| − | position: absolute;
| + | |
| − | background: url('../images/divider.png') no-repeat;
| + | |
| − | width: 40px;
| + | |
| − | height: 10px;
| + | |
| − | }
| + | |
| − | /* start testimonial */
| + | |
| − | .testimonial_bg{
| + | |
| − | background: #f4f4f4;
| + | |
| − | }
| + | |
| − | .testimonial{
| + | |
| − | padding:6% 2%;
| + | |
| − | text-align: center;
| + | |
| − | }
| + | |
| − | .testimonial h2 {
| + | |
| − | color: #202226;
| + | |
| − | text-transform: capitalize;
| + | |
| − | font-size: 3em;
| + | |
| − | }
| + | |
| − | .testimonial h3{
| + | |
| − | color: #A5A5A5;
| + | |
| − | font-size: 1.5em;
| + | |
| − | }
| + | |
| − | .testimonial_text{
| + | |
| − | margin:4% 0;
| + | |
| − | background: #ffffff;
| + | |
| − | padding:4% 8%;
| + | |
| − | position: relative;
| + | |
| − | }
| + | |
| − | .testimonial_text h4{
| + | |
| − | color: #BBBBBB;
| + | |
| − | font-size: 2em;
| + | |
| − | }
| + | |
| − | .testimonial_text:after {
| + | |
| − | content: '';
| + | |
| − | position: absolute;
| + | |
| − | width: 0;
| + | |
| − | height: 0;
| + | |
| − | border: 20px solid #FFFFFF;
| + | |
| − | border-bottom: 0 solid rgba(0, 0, 0, 0)!important;
| + | |
| − | border-right: 15px solid rgba(0, 0, 0, 0)!important;
| + | |
| − | border-left: 15px solid rgba(0, 0, 0, 0)!important;
| + | |
| − | left: 50%;
| + | |
| − | bottom: -20px;
| + | |
| − | margin-left: -10px;
| + | |
| − | }
| + | |
| − | .client_btn{
| + | |
| − | margin-bottom: 4%;
| + | |
| − | }
| + | |
| − | .client_btn a{
| + | |
| − | display: inline-block;
| + | |
| − | text-transform: capitalize;
| + | |
| − | font-size: 1.2em;
| + | |
| − | padding: 8px 28px;
| + | |
| − | color: #ffffff;
| + | |
| − | background: #34BCEB;
| + | |
| − | -webkit-transition: 0.9s;
| + | |
| − | -moz-transition: 0.9s;
| + | |
| − | -o-transition: 0.9s;
| + | |
| − | transition: 0.9s;
| + | |
| − | border-radius: 30px;
| + | |
| − | -webkit-border-radius: 30px;
| + | |
| − | -moz-border-radius:30px;
| + | |
| − | -o-border-radius:30px;
| + | |
| − | }
| + | |
| − | .client_btn a:hover{
| + | |
| − | background: #159ECD;
| + | |
| − | }
| + | |
| − | .client_pic ul li{
| + | |
| − | display: inline-block;
| + | |
| − | margin-right: 10px;
| + | |
| − | }
| + | |
| − | .client_pic ul li a img{
| + | |
| − | margin-bottom: -4px;
| + | |
| − | }
| + | |
| − | .client_pic ul li a.active{
| + | |
| − | border-bottom: 5px solid #FEBD17;
| + | |
| − | }
| + | |
| − | .client_pic ul li a{
| + | |
| − | display:block;
| + | |
| − | -webkit-transition: 0.9s;
| + | |
| − | -moz-transition: 0.9s;
| + | |
| − | -o-transition: 0.9s;
| + | |
| − | transition: 0.9s;
| + | |
| − | }
| + | |
| − | .client_pic ul li a:hover{
| + | |
| − | border-bottom: 5px solid #FEBD17;
| + | |
| − | }
| + | |
| − | /* start clients */
| + | |
| − | .clients_bg{
| + | |
| − | background: #ffffff;
| + | |
| − | }
| + | |
| − | .clients{
| + | |
| − | padding:6% 2%;
| + | |
| − | text-align: center;
| + | |
| − | }
| + | |
| − | .clients_txt{
| + | |
| − | padding-bottom: 4%;
| + | |
| − | }
| + | |
| − | .clients h2{
| + | |
| − | color: #2E2E2E;
| + | |
| − | font-size: 1.8em;
| + | |
| − | text-transform: uppercase;
| + | |
| − | padding: 15px 0 0px 0px;
| + | |
| − | float: left;
| + | |
| − | }
| + | |
| − | .clients h3{
| + | |
| − | float: right;
| + | |
| − | width: 82%;
| + | |
| − | background: url(../images/hd-bg.png) 0% 73% repeat-x;
| + | |
| − | display: inline-block;
| + | |
| − | padding: 10px;
| + | |
| − | height: 15px;
| + | |
| − | margin-top: 12px;
| + | |
| − | }
| + | |
| − | /* start tooltip */
| + | |
| − | .tool_tip1 {
| + | |
| − | margin: 4% 0;
| + | |
| − | }
| + | |
| − | .tt-wrapper{
| + | |
| − | padding:4% 0 10% 0;
| + | |
| − | }
| + | |
| − | .tt-wrapper li:first-child{
| + | |
| − | margin-left: 0;
| + | |
| − | }
| + | |
| − | .tt-wrapper li{
| + | |
| − | float: left;
| + | |
| − | margin-left: 4%;
| + | |
| − | width:16.77777%;
| + | |
| − | }
| + | |
| − | .tt-wrapper li a{
| + | |
| − | display: block;
| + | |
| − | outline: none;
| + | |
| − | position: relative;
| + | |
| − | height: 60px;
| + | |
| − | }
| + | |
| − | .tt-wrapper li .tt-sample{
| + | |
| − | background-position: 0px 0px;
| + | |
| − | }
| + | |
| − | .tt-wrapper li a span{
| + | |
| − | text-transform:uppercase;
| + | |
| − | width: 100px;
| + | |
| − | height: auto;
| + | |
| − | line-height: 20px;
| + | |
| − | padding: 10px;
| + | |
| − | left: 50%;
| + | |
| − | margin-left: -64px;
| + | |
| − | font-weight: normal;
| + | |
| − | font-size: 14px;
| + | |
| − | color: #ffffff;
| + | |
| − | text-align: center;
| + | |
| − | border: 4px solid #000;
| + | |
| − | background:#000000;
| + | |
| − | text-indent: 0px;
| + | |
| − | border-radius: 5px;
| + | |
| − | position: absolute;
| + | |
| − | pointer-events: none;
| + | |
| − | bottom: 100px;
| + | |
| − | opacity: 0;
| + | |
| − | box-shadow: 1px 1px 2px rgba(0,0,0,0.1);
| + | |
| − | -webkit-transition: all 0.3s ease-in-out;
| + | |
| − | -moz-transition: all 0.3s ease-in-out;
| + | |
| − | -o-transition: all 0.3s ease-in-out;
| + | |
| − | -ms-transition: all 0.3s ease-in-out;
| + | |
| − | transition: all 0.3s ease-in-out;
| + | |
| − | }
| + | |
| − | .tt-wrapper li a span:before,
| + | |
| − | .tt-wrapper li a span:after{
| + | |
| − | content: '';
| + | |
| − | position: absolute;
| + | |
| − | bottom: -15px;
| + | |
| − | left: 50%;
| + | |
| − | margin-left: -9px;
| + | |
| − | width: 0;
| + | |
| − | height: 0;
| + | |
| − | border-left: 10px solid transparent;
| + | |
| − | border-right: 10px solid transparent;
| + | |
| − | border-top: 10px solid rgba(0,0,0,0.1);
| + | |
| − | }
| + | |
| − | .tt-wrapper li a span:after{
| + | |
| − | bottom: -14px;
| + | |
| − | margin-left: -10px;
| + | |
| − | border-top: 10px solid #000;
| + | |
| − | }
| + | |
| − | .tt-wrapper li a:hover span{
| + | |
| − | opacity: 0.9;
| + | |
| − | bottom: 70px;
| + | |
| − | }
| + | |
| − | | + | |
| − | /* start products */
| + | |
| − | .products_bg{
| + | |
| − | background: #f1f1f1;
| + | |
| − | }
| + | |
| − | .products{
| + | |
| − | padding:6% 2%;
| + | |
| − | text-align: center;
| + | |
| − | }
| + | |
| − | .products h2{
| + | |
| − | background: #000000;
| + | |
| − | font-size: 1.4em;
| + | |
| − | color: #ffffff;
| + | |
| − | padding: 10px;
| + | |
| − | display: inline-block;
| + | |
| − | text-transform: uppercase;
| + | |
| − | }
| + | |
| − | .products_of_3{
| + | |
| − | display:block;
| + | |
| − | margin-top: 4%;
| + | |
| − | }
| + | |
| − | .product1_of_3{
| + | |
| − | float: left;
| + | |
| − | width: 25.3333%;
| + | |
| − | padding: 2%;
| + | |
| − | margin-right: 4%;
| + | |
| − | background: #ffffff;
| + | |
| − | }
| + | |
| − | .product1_of_3 h3{
| + | |
| − | font-size: 1.2em;
| + | |
| − | color: #000000;
| + | |
| − | text-transform: capitalize;
| + | |
| − | -webkit-text-stroke: 0.5px;
| + | |
| − | margin: 4% 0;
| + | |
| − | -webkit-transition: 0.9s;
| + | |
| − | -moz-transition: 0.9s;
| + | |
| − | -o-transition: 0.9s;
| + | |
| − | transition: 0.9s;
| + | |
| − | }
| + | |
| − | .product1_of_3 h3:hover{
| + | |
| − | color: #febd17;
| + | |
| − | }
| + | |
| − | .product1_of_3 h4{
| + | |
| − | font-size: 1.2em;
| + | |
| − | color: #28AAD6;
| + | |
| − | -webkit-text-stroke: 0.5px;
| + | |
| − | }
| + | |
| − | /* start footer_top */
| + | |
| − | .footer_top_bg{
| + | |
| − | background: #febd17;
| + | |
| − | }
| + | |
| − | .footer_top{
| + | |
| − | padding:6% 2%;
| + | |
| − | text-align: center;
| + | |
| − | }
| + | |
| − | .footer_top h2{
| + | |
| − | color: #FFFFFF;
| + | |
| − | font-size: 2.5em;
| + | |
| − | }
| + | |
| − | .footer_top h2 a{
| + | |
| − | color: #FFFFFF;
| + | |
| − | text-decoration:underline;
| + | |
| − | }
| + | |
| − | .footer_top h2 a:hover{
| + | |
| − | text-decoration:none;
| + | |
| − | -webkit-transition: 0.9s;
| + | |
| − | -moz-transition: 0.9s;
| + | |
| − | -o-transition: 0.9s;
| + | |
| − | transition: 0.9s;
| + | |
| − | }
| + | |
| − | /* start footer */
| + | |
| − | .footer_bg{
| + | |
| − | background: #000000;
| + | |
| − | }
| + | |
| − | .footer{
| + | |
| − | padding:6% 2%;
| + | |
| − | }
| + | |
| − | .span1_of_4{
| + | |
| − | float:left;
| + | |
| − | width: 20.3333333%;
| + | |
| − | margin-right: 4%;
| + | |
| − | }
| + | |
| − | .span1_of_4 h2{
| + | |
| − | font-size: 1.2em;
| + | |
| − | color: #ffffff;
| + | |
| − | text-transform:uppercase;
| + | |
| − | margin-bottom: 8%;
| + | |
| − | }
| + | |
| − | .f_nav1 li{
| + | |
| − | display: inline-block;
| + | |
| − | }
| + | |
| − | .f_nav1 li a{
| + | |
| − | display: block;
| + | |
| − | color: #ABABAB;
| + | |
| − | line-height: 1.8em;
| + | |
| − | font-size: 1em;
| + | |
| − | -webkit-transition: 0.9s;
| + | |
| − | -moz-transition: 0.9s;
| + | |
| − | -o-transition: 0.9s;
| + | |
| − | transition: 0.9s;
| + | |
| − | }
| + | |
| − | .f_nav1 li a:hover{
| + | |
| − | color: #ffffff;
| + | |
| − | }
| + | |
| − | .f_nav2 li{
| + | |
| − | margin:10px 5px 0 0;
| + | |
| − | display: inline-block;
| + | |
| − | background: #222222;
| + | |
| − | -webkit-transition: 0.9s;
| + | |
| − | -moz-transition: 0.9s;
| + | |
| − | -o-transition: 0.9s;
| + | |
| − | transition: 0.9s;
| + | |
| − | border-radius:2px;
| + | |
| − | -webkit-border-radius:2px;
| + | |
| − | -moz-border-radius:2px;
| + | |
| − | -o-border-radius:2px;
| + | |
| − | }
| + | |
| − | .f_nav2 li:hover{
| + | |
| − | background: #333333;
| + | |
| − | }
| + | |
| − | .f_nav2 li a{
| + | |
| − | display: block;
| + | |
| − | color: #ABABAB;
| + | |
| − | font-size: 1em;
| + | |
| − | padding: 10px;
| + | |
| − | }
| + | |
| − | p.f_para{
| + | |
| − | color: #ABABAB;
| + | |
| − | line-height: 1.8em;
| + | |
| − | font-size: 1em;
| + | |
| − | }
| + | |
| − | /*search*/
| + | |
| − | .search{
| + | |
| − | margin-top:8%;
| + | |
| − | position: relative;
| + | |
| − | background: #ffffff;
| + | |
| − | border-radius:4px;
| + | |
| − | -webkit-border-radius:4px;
| + | |
| − | -moz-border-radius:4px;
| + | |
| − | -o-border-radius:4px;
| + | |
| − | }
| + | |
| − | .search input[type="text"]{
| + | |
| − | font-family: 'Source Sans Pro', sans-serif;
| + | |
| − | padding:10px 16px;
| + | |
| − | outline: none;
| + | |
| − | color: #5a5a5a;
| + | |
| − | background: none;
| + | |
| − | border: none;
| + | |
| − | width: 68.33333%;
| + | |
| − | line-height: 1.5em;
| + | |
| − | position: relative;
| + | |
| − | font-size: 1em;
| + | |
| − | text-transform: capitalize;
| + | |
| − | }
| + | |
| − | .search input[type="submit"]{
| + | |
| − | background: url('../images/search1.png') no-repeat 8px 12px;
| + | |
| − | padding: 10px 0px;
| + | |
| − | border: none;
| + | |
| − | cursor: pointer;
| + | |
| − | width: 14.33%;
| + | |
| − | line-height: 1.5em;
| + | |
| − | outline: none;
| + | |
| − | position: absolute;
| + | |
| − | }
| + | |
| − | .search input[type="submit"]:hover {
| + | |
| − | background:url('../images/search1_h.png') no-repeat 8px 12px;
| + | |
| − | -webkit-transition: 0.9s;
| + | |
| − | -moz-transition: 0.9s;
| + | |
| − | -o-transition: 0.9s;
| + | |
| − | transition: 0.9s;
| + | |
| − | }
| + | |
| − | .footer_btm{
| + | |
| − | margin-top:4%;
| + | |
| − | border-top: 6px solid #222222;
| + | |
| − | padding-top: 4%;
| + | |
| − | }
| + | |
| − | .copy{
| + | |
| − | float:left;
| + | |
| − | }
| + | |
| − | .copy p{
| + | |
| − | font-size: 1em;
| + | |
| − | text-transform:uppercase;
| + | |
| − | color: #B9B9B9;
| + | |
| − | }
| + | |
| − | .copy p span{
| + | |
| − | color: #ffffff;
| + | |
| − | }
| + | |
| − | .copy p a{
| + | |
| − | color:#ffffff;
| + | |
| − | -webkit-transition: 0.9s;
| + | |
| − | -moz-transition: 0.9s;
| + | |
| − | -o-transition: 0.9s;
| + | |
| − | transition: 0.9s;
| + | |
| − | }
| + | |
| − | .copy p a:hover{
| + | |
| − | color: #B9B9B9;
| + | |
| − | }
| + | |
| − | /*---top-social-icons-----*/
| + | |
| − | .social-icons {
| + | |
| − | float: right;
| + | |
| − | }
| + | |
| − | .social-icons li{
| + | |
| − | float:left;
| + | |
| − | margin-right:10px;
| + | |
| − | display:inline-block;
| + | |
| − | }
| + | |
| − | .social-icons li a {
| + | |
| − | height: 16px;
| + | |
| − | width: 18px;
| + | |
| − | display: block;
| + | |
| − | background:url(../images/social_icons.png);
| + | |
| − | }
| + | |
| − | .social-icons li:first-child a{
| + | |
| − | background:url(../images/social_icons.png) 0% 0%;
| + | |
| − | }
| + | |
| − | .social-icons li:first-child a:hover{
| + | |
| − | background: url(../images/social_icons.png) 0% 90%;
| + | |
| − | }
| + | |
| − | .social-icons li:nth-child(2) a{
| + | |
| − | background: url(../images/social_icons.png) 8% 0%;
| + | |
| − | }
| + | |
| − | .social-icons li:nth-child(2) a:hover{
| + | |
| − | background: url(../images/social_icons.png) 8% 90%;
| + | |
| − | }
| + | |
| − | .social-icons li:nth-child(3) a{
| + | |
| − | background: url(../images/social_icons.png) 24% 0%;
| + | |
| − | }
| + | |
| − | .social-icons li:nth-child(3) a:hover{
| + | |
| − | background: url(../images/social_icons.png) 24% 90%;
| + | |
| − | }
| + | |
| − | .social-icons li:nth-child(4) a{
| + | |
| − | background: url(../images/social_icons.png) 32% 0%;
| + | |
| − | }
| + | |
| − | .social-icons li:nth-child(4) a:hover{
| + | |
| − | background: url(../images/social_icons.png) 32% 90%;
| + | |
| − | }
| + | |
| − | .social-icons li:nth-child(5) a{
| + | |
| − | background: url(../images/social_icons.png) 40% 0%;
| + | |
| − | }
| + | |
| − | .social-icons li:nth-child(5) a:hover{
| + | |
| − | background: url(../images/social_icons.png) 40% 90%;
| + | |
| − | }
| + | |
| − | .social-icons li:nth-child(6) a{
| + | |
| − | background: url(../images/social_icons.png) 49% 0%;
| + | |
| − | }
| + | |
| − | .social-icons li:nth-child(6) a:hover{
| + | |
| − | background: url(../images/social_icons.png) 49% 90%;
| + | |
| − | }
| + | |
| − | .social-icons li:nth-child(7) a{
| + | |
| − | background: url(../images/social_icons.png) 56% 0%;
| + | |
| − | }
| + | |
| − | .social-icons li:nth-child(7) a:hover{
| + | |
| − | background: url(../images/social_icons.png) 56% 90%;
| + | |
| − | }
| + | |
| − | .social-icons li:nth-child(8) a{
| + | |
| − | background: url(../images/social_icons.png) 66% 0%;
| + | |
| − | }
| + | |
| − | .social-icons li:nth-child(8) a:hover{
| + | |
| − | background: url(../images/social_icons.png) 66% 90%;
| + | |
| − | }
| + | |
| − | .social-icons li:nth-child(9) a{
| + | |
| − | background: url(../images/social_icons.png) 74% 0%;
| + | |
| − | }
| + | |
| − | .social-icons li:nth-child(9) a:hover{
| + | |
| − | background: url(../images/social_icons.png) 74% 90%;
| + | |
| − | }
| + | |
| − | .social-icons li:nth-child(10) a{
| + | |
| − | background: url(../images/social_icons.png) 83% 0%;
| + | |
| − | }
| + | |
| − | .social-icons li:nth-child(10) a:hover{
| + | |
| − | background: url(../images/social_icons.png) 83% 90%;
| + | |
| − | }
| + | |
| − | .social-icons li:nth-child(11) a{
| + | |
| − | background: url(../images/social_icons.png) 92% 0%;
| + | |
| − | }
| + | |
| − | .social-icons li:nth-child(11) a:hover{
| + | |
| − | background: url(../images/social_icons.png) 92% 90%;
| + | |
| − | }
| + | |
| − | .social-icons li:nth-child(12) a{
| + | |
| − | background: url(../images/social_icons.png) 100% 0%;
| + | |
| − | }
| + | |
| − | .social-icons li:nth-child(12) a:hover{
| + | |
| − | background: url(../images/social_icons.png) 100% 90%;
| + | |
| − | }
| + | |
| − | /* start portfolio */
| + | |
| − | .grids_1_of_3_btm{
| + | |
| − | text-align:center;
| + | |
| − | margin-bottom: 4%;
| + | |
| − | }
| + | |
| − | /* start service*/
| + | |
| − | .ser-main{
| + | |
| − | display: block;
| + | |
| − | margin: 4% 0;
| + | |
| − | }
| + | |
| − | .ser-grid{
| + | |
| − | float:right;
| + | |
| − | }
| + | |
| − | .ser-grid-list:nth-last-child(2){
| + | |
| − | margin-right: 0;
| + | |
| − | }
| + | |
| − | .ser-grid-list{
| + | |
| − | float: left;
| + | |
| − | width: 21.33333%;
| + | |
| − | margin-right: 4%;
| + | |
| − | }
| + | |
| − | .ser-grid-list img{
| + | |
| − | margin-top:15px;
| + | |
| − | }
| + | |
| − | .ser-grid-list p{
| + | |
| − | margin: 8% 0;
| + | |
| − | }
| + | |
| − | .ser-para {
| + | |
| − | margin: 2% 0;
| + | |
| − | }
| + | |
| − | h2.style{
| + | |
| − | color: #202226;
| + | |
| − | text-transform: capitalize;
| + | |
| − | font-size: 3em;
| + | |
| − | letter-spacing: -1px;
| + | |
| − | }
| + | |
| − | p.para{
| + | |
| − | color: #000000;
| + | |
| − | line-height: 1.8em;
| + | |
| − | font-size: 1em;
| + | |
| − | }
| + | |
| − | .btn_s {
| + | |
| − | padding: 12px 30px;
| + | |
| − | border: 1px solid #ffffff;
| + | |
| − | background: #202227;
| + | |
| − | display: inline-block;
| + | |
| − | font-size: 1em;
| + | |
| − | text-transform: uppercase;
| + | |
| − | color: #ffffff;
| + | |
| − | -webkit-transition: 0.9s;
| + | |
| − | -moz-transition: 0.9s;
| + | |
| − | -o-transition: 0.9s;
| + | |
| − | transition: 0.9s;
| + | |
| − | }
| + | |
| − | .btn_s:hover {
| + | |
| − | background: #000000;
| + | |
| − | }
| + | |
| − | /* start staff */
| + | |
| − | .staff h3 {
| + | |
| − | margin-top:4%;
| + | |
| − | color: #000000;
| + | |
| − | text-transform: capitalize;
| + | |
| − | font-size: 1.5em;
| + | |
| − | -webkit-transition: 0.9s;
| + | |
| − | -moz-transition: 0.9s;
| + | |
| − | -o-transition: 0.9s;
| + | |
| − | transition: 0.9s;
| + | |
| − | }
| + | |
| − | .staff h3:hover {
| + | |
| − | color: #79C378;
| + | |
| − | }
| + | |
| − | /* start blog */
| + | |
| − | .blog {
| + | |
| − | padding: 2%;
| + | |
| − | }
| + | |
| − | .blog_list{
| + | |
| − | margin-top: 2%;
| + | |
| − | }
| + | |
| − | .blog_list h5{
| + | |
| − | text-transform:capitalize;
| + | |
| − | line-height: 1.5em;
| + | |
| − | font-size:1.4em;
| + | |
| − | color: #202227;
| + | |
| − | -webkit-text-stroke: 0.2px;
| + | |
| − | }
| + | |
| − | .blog_list h5 a{
| + | |
| − | color: #febd17;
| + | |
| − | -webkit-transition: 0.9s;
| + | |
| − | -moz-transition: 0.9s;
| + | |
| − | -o-transition: 0.9s;
| + | |
| − | transition: 0.9s;
| + | |
| − | }
| + | |
| − | .blog_list h5 a:hover{
| + | |
| − | color: #202227;
| + | |
| − | }
| + | |
| − | .blog_para{
| + | |
| − | margin: 2% 0;
| + | |
| − | }
| + | |
| − | .blog_para p a{
| + | |
| − | float: left;
| + | |
| − | margin-right: 4%;
| + | |
| − | }
| + | |
| − | .blog_para p a img{
| + | |
| − | margin-top: 10px;
| + | |
| − | }
| + | |
| − | .read_more1{
| + | |
| − | margin-top: 2%;
| + | |
| − | }
| + | |
| − | /***Contact*/
| + | |
| − | .contact{
| + | |
| − | padding:4% 2%;
| + | |
| − | }
| + | |
| − | .map{
| + | |
| − | margin: 2% 0;
| + | |
| − | }
| + | |
| − | .col{
| + | |
| − | display: block;
| + | |
| − | }
| + | |
| − | .contact-form{
| + | |
| − | position:relative;
| + | |
| − | }
| + | |
| − | .contact-form div{
| + | |
| − | padding:5px 0;
| + | |
| − | }
| + | |
| − | .contact-form span label{
| + | |
| − | color: #202227;
| + | |
| − | display: block;
| + | |
| − | font-size: 1em;
| + | |
| − | padding-bottom: 5px;
| + | |
| − | }
| + | |
| − | .contact-form input[type="text"], .contact-form textarea {
| + | |
| − | font-family: 'Source Sans Pro', sans-serif;
| + | |
| − | background: #FFFFFF;
| + | |
| − | border: 1px solid #E7E7E7;
| + | |
| − | color: rgba(85, 81, 81, 0.84);
| + | |
| − | padding: 8px;
| + | |
| − | display: block;
| + | |
| − | width: 98%;
| + | |
| − | outline: none;
| + | |
| − | -webkit-appearance: none;
| + | |
| − | text-transform: capitalize;
| + | |
| − | }
| + | |
| − | .contact-form textarea{
| + | |
| − | resize:none;
| + | |
| − | height:120px;
| + | |
| − | }
| + | |
| − | .contact-form input[type="submit"]{
| + | |
| − | font-family: 'Source Sans Pro', sans-serif;
| + | |
| − | cursor:pointer;
| + | |
| − | -webkit-appearance: none;
| + | |
| − | padding: 12px 30px;
| + | |
| − | border: 1px solid #ffffff;
| + | |
| − | background: #202227;
| + | |
| − | display: inline-block;
| + | |
| − | font-size: 1em;
| + | |
| − | text-transform: uppercase;
| + | |
| − | color: #ffffff;
| + | |
| − | -webkit-transition: 0.9s;
| + | |
| − | -moz-transition: 0.9s;
| + | |
| − | -o-transition: 0.9s;
| + | |
| − | transition: 0.9s;
| + | |
| − | }
| + | |
| − | .contact-form input[type="submit"]:hover{
| + | |
| − | background: #000000;
| + | |
| − | }
| + | |
| − | /* start feature */
| + | |
| − | .top_grid_bg1{
| + | |
| − | background: #ffffff
| + | |
| − | }
| + | |
| − | .top_grid_btn1 {
| + | |
| − | float: right;
| + | |
| − | }
| + | |
| − | .top_grid_btn1 .btn {
| + | |
| − | padding: 12px 30px;
| + | |
| − | border: 1px solid #202227;
| + | |
| − | display: block;
| + | |
| − | font-size: 1em;
| + | |
| − | text-transform: uppercase;
| + | |
| − | color: #202227;
| + | |
| − | -webkit-transition: 0.9s;
| + | |
| − | -moz-transition: 0.9s;
| + | |
| − | -o-transition: 0.9s;
| + | |
| − | transition: 0.9s;
| + | |
| − | }
| + | |
| − | .top_grid_btn1 .btn:hover{
| + | |
| − | background: #202227;
| + | |
| − | color:#ffffff;
| + | |
| − | }
| + | |
| − | /***** Media Quries *****/
| + | |
| − | @media only screen and (max-width: 1366px) {
| + | |
| − | .wrap{
| + | |
| − | width:95%;
| + | |
| − | }
| + | |
| − | #fwslider .title {
| + | |
| − | margin-left: 8%;
| + | |
| − | }
| + | |
| − | #fwslider .description {
| + | |
| − | margin-left: 8%;
| + | |
| | } | | } |
| − | .image_grid {
| + | |
| − | width: 21.333%;
| + | /* styling for the li that are the menu items */ |
| − | } | + | .menu_items li { |
| − | .tool_tip > ul > li {
| + | width:90%; |
| − | width: 16.33333%;
| + | margin-top:-2px; |
| − | }
| + | padding: 15px 0px 15px 15px ; |
| − | }
| + | |
| − | @media only screen and (max-width: 1280px) {
| + | |
| − | .wrap{ | + | |
| − | width:95%;
| + | |
| − | }
| + | |
| − | .image_grid {
| + | |
| − | width: 21.333%;
| + | |
| − | }
| + | |
| − | .tool_tip > ul > li {
| + | |
| − | width: 16.33333%; | + | |
| − | }
| + | |
| − | }
| + | |
| − | @media only screen and (max-width: 1024px) {
| + | |
| − | .wrap{
| + | |
| − | width:95%;
| + | |
| − | }
| + | |
| − | .tool_tip > ul > li > ul {
| + | |
| − | margin-left: -50px; | + | |
| − | }
| + | |
| − | .clients h3 {
| + | |
| − | width: 76%;
| + | |
| − | }
| + | |
| − | .search input[type="text"] {
| + | |
| − | width: 60.33333%;
| + | |
| − | }
| + | |
| − | .search input[type="submit"] {
| + | |
| − | background: url('../images/search1.png') no-repeat 4px 12px;
| + | |
| − | }
| + | |
| − | .search input[type="submit"]:hover {
| + | |
| − | background: url('../images/search1_h.png') no-repeat 4px 12px;
| + | |
| − | }
| + | |
| − | .images_1_of_3 h3 {
| + | |
| − | font-size: 1.5em;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | @media only screen and (max-width: 800px) {
| + | |
| − | .wrap{
| + | |
| − | width:95%;
| + | |
| − | }
| + | |
| − | .search input[type="text"] {
| + | |
| − | padding: 8px 16px; | + | |
| − | }
| + | |
| − | .logo {
| + | |
| − | text-align:center;
| + | |
| − | }
| + | |
| − | .top-nav{
| + | |
| | display:block; | | display:block; |
| | + | border-bottom: 1px solid #d3d3d3; |
| | + | text-align:left; |
| | + | font-weight:bold; |
| | + | text-decoration:none; |
| | + | color:#000000; |
| | + | list-style-type:none; |
| | + | cursor:pointer; |
| | + | -webkit-transition: all 0.4s ease; |
| | + | -moz-transition: all 0.4s ease; |
| | + | -ms-transition: all 0.4s ease; |
| | + | -o-transition: all 0.4s ease; transition: all 0.4s ease; |
| | } | | } |
| − | .footer_top h2 { | + | |
| − | font-size: 2em; | + | .menu_item a { |
| | + | width: 100%; |
| | + | margin-left: -20px; |
| | + | padding: 11px 90px 12px 20px; |
| | + | text-decoration: none; |
| | + | color:black; |
| | } | | } |
| − | .span1_of_4 { | + | |
| − | float: left; | + | /* When hovering on a menu item */ |
| − | width: 45.333333%;
| + | .menu_items li:hover { |
| − | margin: 4% 4% 0 0; | + | background-color:#72c9b6; |
| | + | color: #000000; |
| | } | | } |
| − | .span1_of_4:nth-child(2),.span1_of_4:nth-child(4){ | + | |
| − | margin-right: 0; | + | /* styling for the submenus */ |
| | + | .submenu { |
| | + | width:100%; |
| | + | display: none; |
| | + | font-weight:bold; |
| | + | cursor:pointer; |
| | + | |
| | } | | } |
| − | .search input[type="text"] { | + | |
| − | width: 75.33333%; | + | /* moving the margin for the submenu ul list */ |
| | + | ul.submenu { |
| | + | width: 100%; |
| | + | margin: 10px 0px -11px 0px; |
| | + | list-style: none; |
| | } | | } |
| − | .footer_btm { | + | |
| − | text-align: center; | + | /*styling for the submenu buttons */ |
| | + | .submenu li { |
| | + | width: 100%; |
| | + | margin-left: 10px; |
| | + | margin-bottom: 0px; |
| | } | | } |
| − | .social-icons { | + | |
| − | float: none; | + | |
| − | margin-bottom: 4%; | + | /* hover state for the submenu buttons */ |
| | + | .submenu li a { |
| | + | width: 100%; |
| | + | padding: 5px 10px; |
| | + | display: inline-block; |
| | + | border-bottom: 1px solid #d3d3d3; |
| | + | background-color:white; |
| | + | text-decoration:none; |
| | + | color:#000000; |
| | } | | } |
| − | .social-icons li { | + | |
| − | float: none; | + | |
| | + | |
| | + | .submenu li a:hover { |
| | + | background-color:#000000; |
| | + | color: #72c9b6; |
| | } | | } |
| − | .copy { | + | |
| − | float: none; | + | |
| | + | /* When the screen is smaller than 680px, the menu has the option to hide/show - this button controls that */ |
| | + | .collapsable_menu_control { |
| | + | width:100%; |
| | + | padding: 15px 0px; |
| | + | display:none; |
| | + | background-color:#000000; |
| | + | text-align:center; |
| | + | font-weight:bold; |
| | + | color:#72c9b6; |
| | + | cursor:pointer; |
| | + | -webkit-transition: all 0.4s ease; |
| | + | -moz-transition: all 0.4s ease; |
| | + | -ms-transition: all 0.4s ease; |
| | + | -o-transition: all 0.4s ease; |
| | + | transition: all 0.4s ease; |
| | } | | } |
| − | .ser-grid-list { | + | |
| − | float: left; | + | /* when hovering on that button */ |
| − | width: 45.33333%; | + | .collapsable_menu_control:hover { |
| − | margin-right: 4%;
| + | background-color: #72c9b6; |
| | + | color:#000000; |
| | } | | } |
| − | .ser-grid-list:nth-child(2),.ser-grid-list:nth-child(4){ | + | |
| − | margin-right: 0 | + | /********************************* CONTENT OF THE PAGE ********************************/ |
| | + | |
| | + | /* Wrapper for the content */ |
| | + | .content_wrapper { |
| | + | width: 85%; |
| | + | margin-left:150px; |
| | + | padding:10px 0px; |
| | + | float:left; |
| | + | background-color:white; |
| | } | | } |
| − | .da-thumbs li article h3 { | + | |
| − | font-size: 1em; | + | /*LAYOUT */ |
| − | padding: 30px 0 20px 0; | + | .column { |
| | + | padding: 10px 0px; |
| | + | float:left; |
| | + | background-color:white; |
| | } | | } |
| − | h2.style { | + | |
| − | font-size: 2em; | + | .full_size { |
| | + | width:100%; |
| | } | | } |
| − | }
| + | |
| − | @media only screen and (max-width: 640px){
| + | .full_size img { |
| − | .wrap{ | + | padding: 10px 15px; |
| − | width:95%; | + | width:96.5%; |
| | } | | } |
| − | .testimonial h2 { | + | |
| − | font-size: 2em; | + | .half_size { |
| | + | width: 50%; |
| | } | | } |
| − | .testimonial_text h4 { | + | .half_size img { |
| − | font-size: 1.5em; | + | padding: 10px 15px; |
| | + | width: 93%; |
| | } | | } |
| − | .clients h2 { | + | |
| − | font-size: 1.5em; | + | |
| | + | .clear { |
| | + | clear:both; |
| | } | | } |
| − | .clients h3 { | + | |
| − | width: 66%; | + | .highlight { |
| | + | width: 90%; |
| | + | margin: auto; |
| | + | padding: 15px 5px; |
| | + | background-color: #f2f2f2; |
| | } | | } |
| − | .clients_txt { | + | |
| − | padding-bottom: 10%; | + | .judges-will-not-evaluate { |
| | + | border: 4px solid #72c9b6; |
| | + | display: block; |
| | + | margin: 5px 15px; |
| | + | width: 95%; |
| | + | font-weight:bold; |
| | } | | } |
| − | .images_1_of_3 { | + | |
| − | width: 99.333%; | + | |
| | + | /*STYLING */ |
| | + | |
| | + | /* styling for the titles */ |
| | + | .content_wrapper h1, .content_wrapper h2 { |
| | + | padding:5px 15px; |
| | + | border-bottom:0px; |
| | + | color:#72c9b6; |
| | + | |
| | } | | } |
| − | .grid_1_of_3 { | + | .content_wrapper h3, .content_wrapper h4, .content_wrapper h5, .content_wrapper h6 { |
| − | margin-left: 0%; | + | padding:5px 15px; |
| | + | border-bottom:0px; |
| | + | color: #000000; |
| | } | | } |
| − | .da-thumbs li article h3 { | + | |
| − | font-size: 1em; | + | |
| − | padding: 10px 0 10px 0; | + | /* font and text */ |
| | + | .content_wrapper p { |
| | + | padding:0px 15px; |
| | + | font-size: 13px; |
| | + | font-family:Tahoma, Geneva, sans-serif; |
| | } | | } |
| − | }
| + | |
| − | @media only screen and (max-width: 480px) {
| + | /* Links */ |
| − | .wrap{ | + | .content_wrapper a { |
| − | width:95%; | + | font-weight: bold; |
| | + | text-decoration: underline; |
| | + | text-decoration-color:#72c9b6; |
| | + | color: #72c9b6; |
| | + | -webkit-transition: all 0.4s ease; |
| | + | -moz-transition: all 0.4s ease; |
| | + | -ms-transition: all 0.4s ease; |
| | + | -o-transition: all 0.4s ease; |
| | + | transition: all 0.4s ease; |
| | } | | } |
| − | .images_1_of_3 { | + | |
| − | width: 99.333%; | + | /* hover for the links */ |
| − | margin-top: 4%;
| + | .content_wrapper a:hover { |
| | + | text-decoration:none; |
| | + | color:#000000; |
| | } | | } |
| − | .images_1_of_3 h3 { | + | |
| − | margin: 0; | + | /* non numbered lists */ |
| | + | .content_wrapper ul { |
| | + | padding:0px 20px; |
| | + | font-size: 13px; |
| | + | font-family:Tahoma, Geneva, sans-serif; |
| | } | | } |
| − | .grid_1_of_3 { | + | |
| − | margin-left: 0%; | + | /* numbered lists */ |
| | + | .content_wrapper ol { |
| | + | padding:0px; |
| | + | font-size: 13px; |
| | + | font-family:Tahoma, Geneva, sans-serif; |
| | } | | } |
| − | .mid_grid h2 { | + | |
| − | font-size: 1.5em; | + | /* Table */ |
| − | -webkit-text-stroke: 1px; | + | .content_wrapper table { |
| | + | width: 97%; |
| | + | margin:15px 10px; |
| | + | border: 1px solid #d3d3d3; |
| | + | border-collapse: collapse; |
| | } | | } |
| − | .mid_grid h3 { | + | |
| − | font-size: 1em; | + | /* table cells */ |
| | + | .content_wrapper td { |
| | + | padding: 10px; |
| | + | vertical-align: text-top; |
| | + | border: 1px solid #d3d3d3; |
| | + | border-collapse: collapse; |
| | } | | } |
| − | .span1_of_3 { | + | |
| − | margin-top:4%; | + | /* table headers */ |
| − | width: 99.3333%; | + | .content_wrapper th { |
| − | float: none; | + | padding: 10px; |
| − | margin-right: 0%; | + | vertical-align: text-top; |
| | + | border: 1px solid #d3d3d3; |
| | + | border-collapse: collapse; |
| | + | background-color:#f2f2f2; |
| | } | | } |
| − | .testimonial_text h4 { | + | |
| − | font-size: 1em; | + | /* Button class */ |
| | + | .button_click { |
| | + | margin: 10px auto; |
| | + | padding: 15px; width:12%; |
| | + | text-align:center; |
| | + | font-weight:bold; |
| | + | background-color: #72c9b6; |
| | + | cursor:pointer; |
| | + | -webkit-transition: all 0.4s ease; |
| | + | -moz-transition: all 0.4s ease; |
| | + | -ms-transition: all 0.4s ease; |
| | + | -o-transition: all 0.4s ease; |
| | + | transition: all 0.4s ease; |
| | } | | } |
| − | .clients h3 { | + | |
| − | width: 50%; | + | /* button class on hover */ |
| | + | .button_click:hover { |
| | + | background-color:#000000; |
| | + | color:#72c9b6; |
| | } | | } |
| − | .tool_tip > ul > li > ul { | + | |
| − | width: 99.33333%; | + | /********************************* RESPONSIVE STYLING ********************************/ |
| | + | |
| | + | /* IF THE SCREEN IS LESS THAN 1000PX */ |
| | + | |
| | + | @media only screen and (max-width: 1000px) { |
| | + | |
| | + | #content {width:100%; } |
| | + | .menu_wrapper {width:15%;} |
| | + | .content_wrapper {margin-left: 15%;} |
| | + | .menu_item {display:block;} |
| | + | .icon {display:none;} |
| | + | .highlight {padding:10px 0px;} |
| | } | | } |
| − | .span1_of_4 { | + | |
| − | float: none;
| + | |
| − | width: 99.333333%;
| + | /* IF THE SCREEN IS LESS THAN 680PX */ |
| − | margin: 4% 0% 0 0; | + | |
| − | }
| + | @media only screen and (max-width: 680px) { |
| − | .span1_of_4 h2 {
| + | .collapsable_menu_control { display:block;} |
| − | margin-bottom: 4%;
| + | .menu_item {display:none;} |
| − | }
| + | .menu_wrapper { width:100%; height: 15%; position:relative;} |
| − | .search input[type="text"] {
| + | .content_wrapper {width:100%; margin-left:0px;} |
| − | width: 80.33333%;
| + | .column.half_size {width:100%; } |
| − | }
| + | .column img { width: 100%; padding: 5px 0px;} |
| − | .ser-grid-list {
| + | .icon {display:block;} |
| − | float: left;
| + | .highlight {padding:15px 5px;} |
| − | width: 99.33333%;
| + | |
| − | margin-right: 0%;
| + | |
| − | }
| + | |
| − | .ser-grid-list p {
| + | |
| − | margin: 4% 0;
| + | |
| − | }
| + | |
| − | .tt-wrapper li a span {
| + | |
| − | left: 36%;
| + | |
| − | }
| + | |
| − | } | + | |
| − | @media only screen and (max-width: 320px) {
| + | |
| − | .wrap{
| + | |
| − | width:95%;
| + | |
| | } | | } |
| − | .top_grid_text {
| + | |
| − | float: none;
| + | </style> |
| − | text-align:center;
| + | |
| − | }
| + | |
| − | .top_grid_btn {
| + | |
| − | float: none;
| + | |
| − | text-align:center;
| + | |
| − | margin: 4% 0;
| + | |
| − | }
| + | |
| − | .mid_grid_left {
| + | |
| − | float: none;
| + | |
| − | width: 99.333333%;
| + | |
| − | margin-right: 0%;
| + | |
| − | }
| + | |
| − | .mid_grid_right {
| + | |
| − | margin-top:4%;
| + | |
| − | float: none;
| + | |
| − | width: 99.333333%;
| + | |
| − | }
| + | |
| − | .clients h3 {
| + | |
| − | display: none;
| + | |
| − | }
| + | |
| − | .search input[type="text"] {
| + | |
| − | width: 74.33333%;
| + | |
| − | }
| + | |
| − | .client_pic ul li {
| + | |
| − | display: inline-block;
| + | |
| − | margin-right: 4px;
| + | |
| − | width: 17.3333%;
| + | |
| − | }
| + | |
| − | .logo {
| + | |
| − | float: none;
| + | |
| − | }
| + | |
| − | .h_menu4 {
| + | |
| − | margin: 0 0 5px 0;
| + | |
| − | }
| + | |
| − | .tt-wrapper li a span {
| + | |
| − | width: 87px;
| + | |
| − | line-height: 15px;
| + | |
| − | padding: 6px;
| + | |
| − | font-size: 13px;
| + | |
| − | border: 2px solid #000;
| + | |
| − | bottom: 100px;
| + | |
| − | }
| + | |
| − | .tt-wrapper li a span:after {
| + | |
| − | bottom: -12px;
| + | |
| − | margin-left: 3px;
| + | |
| − | }
| + | |
| − | }
| + | |
| | | | |
| | | | |
| | | | |
| | | | |
| − | /* Magnific Popup CSS */
| + | <!--- THIS IS WHERE THE HTML BEGINS ---> |
| − | .mfp-bg {
| + | |
| − | font-family: 'Source Sans Pro', sans-serif;
| + | |
| − | top: 0;
| + | |
| − | left: 0;
| + | |
| − | width: 100%;
| + | |
| − | height: 100%;
| + | |
| − | z-index: 1042;
| + | |
| − | overflow: hidden;
| + | |
| − | position: fixed;
| + | |
| − | background: #0b0b0b;
| + | |
| − | opacity: 0.9;
| + | |
| − | filter: alpha(opacity=80); }
| + | |
| | | | |
| − | .mfp-wrap {
| |
| − | top: 0;
| |
| − | left: 0;
| |
| − | width: 100%;
| |
| − | height: 100%;
| |
| − | z-index: 1043;
| |
| − | position: fixed;
| |
| − | outline: none !important;
| |
| − | -webkit-backface-visibility: hidden; }
| |
| | | | |
| − | .mfp-container {
| + | <!-- This tells the browser that your page is responsive --> |
| − | text-align: center;
| + | |
| − | position: absolute;
| + | |
| − | width: 100%;
| + | |
| − | height: 100%;
| + | |
| − | left: 0;
| + | |
| − | top: 0;
| + | |
| − | padding: 0 8px;
| + | |
| − | -webkit-box-sizing: border-box;
| + | |
| − | -moz-box-sizing: border-box;
| + | |
| − | box-sizing: border-box; }
| + | |
| | | | |
| − | .mfp-container:before {
| + | <head> |
| − | content: '';
| + | <meta name="viewport" content="width=device-width, initial-scale=1"> |
| − | display: inline-block;
| + | </head> |
| − | height: 100%;
| + | |
| − | vertical-align: middle; }
| + | |
| | | | |
| − | .mfp-align-top .mfp-container:before {
| |
| − | display: none; }
| |
| | | | |
| − | .mfp-content {
| |
| − | position: relative;
| |
| − | display: inline-block;
| |
| − | vertical-align: middle;
| |
| − | margin: 0 auto;
| |
| − | text-align: left;
| |
| − | z-index: 1045; }
| |
| | | | |
| − | .mfp-inline-holder .mfp-content,
| |
| − | .mfp-ajax-holder .mfp-content {
| |
| − | width: 100%;
| |
| − | cursor: auto; }
| |
| | | | |
| − | .mfp-ajax-cur {
| + | <div class="menu_wrapper" > |
| − | cursor: progress; }
| + | |
| | | | |
| − | .mfp-zoom-out-cur,
| |
| − | .mfp-zoom-out-cur .mfp-image-holder .mfp-close {
| |
| − | cursor: -moz-zoom-out;
| |
| − | cursor: -webkit-zoom-out;
| |
| − | cursor: zoom-out; }
| |
| | | | |
| − | .mfp-zoom {
| |
| − | cursor: pointer;
| |
| − | cursor: -webkit-zoom-in;
| |
| − | cursor: -moz-zoom-in;
| |
| − | cursor: zoom-in; }
| |
| | | | |
| − | .mfp-auto-cursor .mfp-content {
| |
| − | cursor: auto; }
| |
| | | | |
| − | .mfp-close,
| + | <div class="collapsable_menu_control"> MENU ? </div> |
| − | .mfp-arrow,
| + | |
| − | .mfp-preloader,
| + | |
| − | .mfp-counter {
| + | |
| − | -webkit-user-select: none;
| + | |
| − | -moz-user-select: none;
| + | |
| − | user-select: none; }
| + | |
| | | | |
| − | .mfp-loading.mfp-figure {
| + | <ul id="accordion" class="accordion"> |
| − | display: none; }
| + | |
| | | | |
| − | .mfp-hide { | + | <li class="menu_item"> <a href="https://2016.igem.org/Team:TJUSLS_China">HOME </a> </li> |
| − | display: none !important; }
| + | |
| | | | |
| − | .mfp-preloader {
| |
| − | color: #cccccc;
| |
| − | position: absolute;
| |
| − | top: 50%;
| |
| − | width: auto;
| |
| − | text-align: center;
| |
| − | margin-top: -0.8em;
| |
| − | left: 8px;
| |
| − | right: 8px;
| |
| − | z-index: 1044; }
| |
| | | | |
| − | .mfp-preloader a { | + | <li class="menu_item"> <div class="icon plus"></div> TEAM |
| − | color: #cccccc; }
| + | <ul class="submenu"> |
| | + | <li> <a href=" https://2016.igem.org/Team:TJUSLS_China/Team"> Team </a> </li> |
| | + | <li> <a href="https://2016.igem.org/Team:TJUSLS_China/Collaborations">бя Collaborations </a> </li> |
| | + | </ul> |
| | + | </li> |
| | | | |
| − | .mfp-preloader a:hover { | + | <li class="menu_item"> <div class="icon plus"></div> PROJECT |
| − | color: white; }
| + | <ul class="submenu"> |
| | + | <li> <a href="https://2016.igem.org/Team:TJUSLS_China/Description"> бя Description </a></li> |
| | + | <li> <a href="https://2016.igem.org/Team:TJUSLS_China/Design"> бя Design </a></li> |
| | + | <li> <a href="https://2016.igem.org/Team:TJUSLS_China/Experiments"> Experiments </a></li> |
| | + | <li> <a href="https://2016.igem.org/Team:TJUSLS_China/Proof"> бя Proof of Concept </a></li> |
| | + | <li> <a href="https://2016.igem.org/Team:TJUSLS_China/Demonstrate"> бя Demonstrate </a></li> |
| | + | <li> <a href="https://2016.igem.org/Team:TJUSLS_China/Modeling"> Modeling </a></li> |
| | + | <li> <a href="https://2016.igem.org/Team:TJUSLS_China/Results"> Results </a></li> |
| | + | <li> <a href="https://2016.igem.org/Team:TJUSLS_China/Notebook"> Notebook </a></li> |
| | + | </ul> |
| | + | </li> |
| | | | |
| − | .mfp-s-ready .mfp-preloader { | + | <li class="menu_item"> <div class="icon plus"></div> PARTS |
| − | display: none; }
| + | <ul class="submenu"> |
| | + | <li> <a href="https://2016.igem.org/Team:TJUSLS_China/Parts">Parts </a></li> |
| | + | <li> <a href="https://2016.igem.org/Team:TJUSLS_China/Basic_Part"> бя Basic Parts </a></li> |
| | + | <li> <a href="https://2016.igem.org/Team:TJUSLS_China/Composite_Part"> бя Composite Parts </a></li> |
| | + | <li> <a href="https://2016.igem.org/Team:TJUSLS_China/Part_Collection"> бя Part Collection </a></li> |
| | + | </ul> |
| | + | </li> |
| | | | |
| − | .mfp-s-error .mfp-content {
| |
| − | display: none; }
| |
| | | | |
| − | button.mfp-close,
| + | <li class="menu_item"> <a href="https://2016.igem.org/Team:TJUSLS_China/Safety"> SAFETY </a> </li> |
| − | button.mfp-arrow {
| + | |
| − | overflow: visible;
| + | |
| − | cursor: pointer;
| + | |
| − | background: transparent;
| + | |
| − | border: 0;
| + | |
| − | -webkit-appearance: none;
| + | |
| − | display: block;
| + | |
| − | padding: 0;
| + | |
| − | z-index: 1046; }
| + | |
| | | | |
| − | button::-moz-focus-inner {
| |
| − | padding: 0;
| |
| − | border: 0; }
| |
| | | | |
| − | .mfp-close {
| + | <li class="menu_item"> <a href="https://2016.igem.org/Team:TFJUSLS_China/Attributions">бя ATTRIBUTIONS </a></li> |
| − | width:30px;
| + | |
| − | height:30px;
| + | |
| − | line-height: 44px;
| + | |
| − | position: absolute;
| + | |
| − | right: 0;
| + | |
| − | top: 0;
| + | |
| − | text-decoration: none;
| + | |
| − | text-align: center;
| + | |
| − | opacity: 0.65;
| + | |
| − | padding: 0 0 18px 10px;
| + | |
| − | color: white;
| + | |
| − | font-style: normal;
| + | |
| − | font-size: 28px;
| + | |
| − | outline:none;
| + | |
| − | } | + | |
| − | .mfp-close:hover, .mfp-close:focus {
| + | |
| − | opacity: 9; }
| + | |
| − | .mfp-close:active {
| + | |
| − | top: 0px; }
| + | |
| | | | |
| − | .mfp-close-btn-in .mfp-close {
| |
| − | color: #333333; }
| |
| | | | |
| − | .mfp-image-holder .mfp-close, | + | <li class="menu_item"> <div class="icon plus"></div> HUMAN PRACTICES |
| − | .mfp-iframe-holder .mfp-close { | + | <ul class="submenu"> |
| − | color: white;
| + | <li> <a href="https://2016.igem.org/Team:TJUSLS_China/Human_Practices"> Human Practices </a></li> |
| − | right: -6px;
| + | <li> <a href="https://2016.igem.org/Team:TJUSLS_China/HP/Silver">бя Silver </a></li> |
| − | text-align: right;
| + | <li> <a href="https://2016.igem.org/Team:TJUSLS_China/HP/Gold">бя Gold </a></li> |
| − | padding-right: 6px;
| + | <li> <a href="https://2016.igem.org/Team:TJUSLS_China/Integrated_Practices"> бя Integrated Practices </a></li> |
| − | width: 100%;
| + | <li> <a href="https://2016.igem.org/Team:TJUSLS_China/Engagement">бя Engagement </a></li> |
| − | outline:none;
| + | </ul> |
| − | }
| + | </li> |
| | | | |
| − | .mfp-counter {
| |
| − | position: absolute;
| |
| − | top: 0;
| |
| − | right: 0;
| |
| − | color: #cccccc;
| |
| − | font-size: 12px;
| |
| − | line-height: 18px; }
| |
| | | | |
| − | .mfp-arrow {
| + | <li class="menu_item"> <div class="icon plus"></div> AWARDS |
| − | position: absolute;
| + | <ul class="submenu"> |
| − | opacity: 0.65;
| + | <li><a href="https://2016.igem.org/Team:TJUSLS_China/Entrepreneurship"> бя Entrepreneurship </a></li> |
| − | margin: 0;
| + | <li> <a href="https://2016.igem.org/Team:TJUSLS_China/Hardware"> бя Hardware </a></li> |
| − | top: 50%;
| + | <li> <a href="https://2016.igem.org/Team:TJUSLS_China/Software">бя Software </a></li> |
| − | margin-top: -55px;
| + | <li> <a href="https://2016.igem.org/Team:TJUSLS_China/Measurement">бя Measurement </a></li> |
| − | padding: 0;
| + | <li> <a href="https://2016.igem.org/Team:TJUSLS_China/Model">бя Model </a></li> |
| − | width: 90px;
| + | |
| − | height: 110px;
| + | |
| − | -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
| + | |
| | | | |
| − | .mfp-arrow:active {
| + | </ul> |
| − | margin-top: -54px; }
| + | </li> |
| | + | </ul> |
| | | | |
| − | .mfp-arrow:hover,
| + | </div> |
| − | .mfp-arrow:focus {
| + | |
| − | opacity: 1; }
| + | |
| | | | |
| − | .mfp-arrow:before, .mfp-arrow:after,
| |
| − | .mfp-arrow .mfp-b,
| |
| − | .mfp-arrow .mfp-a {
| |
| − | content: '';
| |
| − | display: block;
| |
| − | width: 0;
| |
| − | height: 0;
| |
| − | position: absolute;
| |
| − | left: 0;
| |
| − | top: 0;
| |
| − | margin-top: 35px;
| |
| − | margin-left: 35px;
| |
| − | border: medium inset transparent; }
| |
| − | .mfp-arrow:after,
| |
| − | .mfp-arrow .mfp-a {
| |
| − | border-top-width: 13px;
| |
| − | border-bottom-width: 13px;
| |
| − | top: 8px; }
| |
| − | .mfp-arrow:before,
| |
| − | .mfp-arrow .mfp-b {
| |
| − | border-top-width: 21px;
| |
| − | border-bottom-width: 21px; }
| |
| | | | |
| − | .mfp-arrow-left {
| |
| − | left: 0; }
| |
| − | .mfp-arrow-left:after,
| |
| − | .mfp-arrow-left .mfp-a {
| |
| − | border-right: 17px solid white;
| |
| − | margin-left: 31px; }
| |
| − | .mfp-arrow-left:before,
| |
| − | .mfp-arrow-left .mfp-b {
| |
| − | margin-left: 25px;
| |
| − | border-right: 27px solid #3f3f3f; }
| |
| | | | |
| − | .mfp-arrow-right {
| |
| − | right: 0; }
| |
| − | .mfp-arrow-right:after,
| |
| − | .mfp-arrow-right .mfp-a {
| |
| − | border-left: 17px solid white;
| |
| − | margin-left: 39px; }
| |
| − | .mfp-arrow-right:before,
| |
| − | .mfp-arrow-right .mfp-b {
| |
| − | border-left: 27px solid #3f3f3f; }
| |
| | | | |
| − | .mfp-iframe-holder {
| |
| − | padding-top: 40px;
| |
| − | padding-bottom: 40px; }
| |
| | | | |
| − | .mfp-iframe-holder .mfp-content {
| + | <div class="content_wrapper"> |
| − | line-height: 0;
| + | |
| − | width: 100%;
| + | |
| − | max-width: 900px; }
| + | |
| | | | |
| − | .mfp-iframe-scaler {
| |
| − | width: 100%;
| |
| − | height: 0;
| |
| − | overflow: hidden;
| |
| − | padding-top: 56.25%; }
| |
| | | | |
| − | .mfp-iframe-scaler iframe {
| |
| − | position: absolute;
| |
| − | display: block;
| |
| − | top: 0;
| |
| − | left: 0;
| |
| − | width: 100%;
| |
| − | height: 100%;
| |
| − | box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
| |
| − | background: black; }
| |
| | | | |
| − | .mfp-iframe-holder .mfp-close {
| + | <h1 id="team_name"> </h1> |
| − | top: -40px; }
| + | <h4 id="page_name"> </h4> |
| | | | |
| − | /* Main image in popup */
| |
| − | img.mfp-img {
| |
| − | width: auto;
| |
| − | max-width: 100%;
| |
| − | height: auto;
| |
| − | display: block;
| |
| − | line-height: 0;
| |
| − | -webkit-box-sizing: border-box;
| |
| − | -moz-box-sizing: border-box;
| |
| − | box-sizing: border-box;
| |
| − | padding: 40px 0 40px;
| |
| − | margin: 0 auto; }
| |
| | | | |
| − | /* The shadow behind the image */
| |
| − | .mfp-figure:after {
| |
| − | content: '';
| |
| − | position: absolute;
| |
| − | left: 0;
| |
| − | top: 40px;
| |
| − | bottom: 40px;
| |
| − | display: block;
| |
| − | right: 0;
| |
| − | width: auto;
| |
| − | height: auto;
| |
| − | z-index: -1;
| |
| − | box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
| |
| − | background: #444444; }
| |
| | | | |
| − | .mfp-figure {
| |
| − | line-height: 0; }
| |
| | | | |
| − | .mfp-bottom-bar {
| |
| − | margin-top: -36px;
| |
| − | position: absolute;
| |
| − | top: 100%;
| |
| − | left: 0;
| |
| − | width: 100%;
| |
| − | cursor: auto; }
| |
| | | | |
| − | .mfp-title {
| |
| − | text-align: left;
| |
| − | line-height: 18px;
| |
| − | color: #f3f3f3;
| |
| − | word-break: break-word;
| |
| − | padding-right: 36px; }
| |
| | | | |
| − | .mfp-figure small {
| |
| − | color: #bdbdbd;
| |
| − | display: block;
| |
| − | font-size: 12px;
| |
| − | line-height: 14px; }
| |
| | | | |
| − | .mfp-image-holder .mfp-content {
| |
| − | max-width: 100%; }
| |
| | | | |
| − | .mfp-gallery .mfp-image-holder .mfp-figure {
| |
| − | cursor: pointer; }
| |
| − | /******** Plans List *******/
| |
| − | /* Styles for dialog window */
| |
| − | #small-dialog {
| |
| − | background: white;
| |
| − | padding: 20px 30px;
| |
| − | text-align: left;
| |
| − | max-width: 400px;
| |
| − | margin: 40px auto;
| |
| − | position: relative;
| |
| − | border-radius:2px;
| |
| − | -webkit-border-radius:2px;
| |
| − | -moz-border-radius:2px;
| |
| − | -o-border-radius:2px;
| |
| − | }
| |
| − | /**
| |
| | | | |
| − | /**
| + | <script> |
| − | * Fade-zoom animation for first dialog
| + | |
| − | */
| + | |
| | | | |
| − | /* start state */ | + | // This is the jquery part of your template. Try not modify any of this code since it makes your menu work. |
| − | .my-mfp-zoom-in #small-dialog { | + | |
| − | opacity: 0;
| + | |
| − | -webkit-transition: all 0.2s ease-in-out;
| + | |
| − | -moz-transition: all 0.2s ease-in-out;
| + | |
| − | -o-transition: all 0.2s ease-in-out;
| + | |
| − | transition: all 0.2s ease-in-out;
| + | |
| − | -webkit-transform: scale(0.8);
| + | |
| − | -moz-transform: scale(0.8);
| + | |
| − | -ms-transform: scale(0.8);
| + | |
| − | -o-transform: scale(0.8);
| + | |
| − | transform: scale(0.8);
| + | |
| − | }
| + | |
| − | /* animate in */
| + | |
| − | .my-mfp-zoom-in.mfp-ready #small-dialog {
| + | |
| − | opacity: 1;
| + | |
| − | -webkit-transform: scale(1);
| + | |
| − | -moz-transform: scale(1);
| + | |
| − | -ms-transform: scale(1);
| + | |
| − | -o-transform: scale(1);
| + | |
| − | transform: scale(1);
| + | |
| − | }
| + | |
| − | /* animate out */
| + | |
| − | .my-mfp-zoom-in.mfp-removing #small-dialog{
| + | |
| − | -webkit-transform: scale(0.8);
| + | |
| − | -moz-transform: scale(0.8);
| + | |
| − | -ms-transform: scale(0.8);
| + | |
| − | -o-transform: scale(0.8);
| + | |
| − | transform: scale(0.8);
| + | |
| − | opacity: 0;
| + | |
| − | }
| + | |
| − | /* Dark overlay, start state */
| + | |
| − | .my-mfp-zoom-in.mfp-bg {
| + | |
| − | opacity: 0;
| + | |
| − | -webkit-transition: opacity 0.3s ease-out;
| + | |
| − | -moz-transition: opacity 0.3s ease-out;
| + | |
| − | -o-transition: opacity 0.3s ease-out;
| + | |
| − | transition: opacity 0.3s ease-out;
| + | |
| − | }
| + | |
| − | /* animate in */
| + | |
| − | .my-mfp-zoom-in.mfp-ready.mfp-bg {
| + | |
| − | opacity: 0.9;
| + | |
| − | }
| + | |
| − | /* animate out */
| + | |
| − | .my-mfp-zoom-in.mfp-removing.mfp-bg{
| + | |
| − | opacity: 0;
| + | |
| − | }
| + | |
| − | /* pop_up */
| + | |
| − | .pop_up h2{
| + | |
| − | text-transform: capitalize;
| + | |
| − | font-size: 2em;
| + | |
| − | color: #202227;
| + | |
| − | margin-bottom: 2%;
| + | |
| − | }
| + | |
| − | .pop_up p{
| + | |
| − | font-size: 1em;
| + | |
| − | color: #555555;
| + | |
| − | line-height: 1.8em;
| + | |
| − | }
| + | |
| − | #small-dialog1{
| + | |
| − | background: white;
| + | |
| − | padding: 20px 30px;
| + | |
| − | text-align: left;
| + | |
| − | max-width: 400px;
| + | |
| − | margin: 40px auto;
| + | |
| − | position: relative;
| + | |
| − | border-radius:2px;
| + | |
| − | -webkit-border-radius:2px;
| + | |
| − | -moz-border-radius:2px;
| + | |
| − | -o-border-radius:2px;
| + | |
| − | }
| + | |
| − | /**
| + | |
| | | | |
| − | /**
| + | $(document).ready(function() { |
| − | * Fade-zoom animation for first dialog
| + | |
| − | */
| + | |
| | | | |
| − | /* start state */
| + | $("#HQ_page").attr('id',''); |
| − | .my-mfp-zoom-in #small-dialog1 {
| + | |
| − | opacity: 0;
| + | |
| − | -webkit-transition: all 0.2s ease-in-out;
| + | |
| − | -moz-transition: all 0.2s ease-in-out;
| + | |
| − | -o-transition: all 0.2s ease-in-out;
| + | |
| − | transition: all 0.2s ease-in-out;
| + | |
| − | -webkit-transform: scale(0.8);
| + | |
| − | -moz-transform: scale(0.8);
| + | |
| − | -ms-transform: scale(0.8);
| + | |
| − | -o-transform: scale(0.8);
| + | |
| − | transform: scale(0.8);
| + | |
| − | }
| + | |
| − | /* animate in */
| + | |
| − | .my-mfp-zoom-in.mfp-ready #small-dialog1 {
| + | |
| − | opacity: 1;
| + | |
| − | -webkit-transform: scale(1);
| + | |
| − | -moz-transform: scale(1);
| + | |
| − | -ms-transform: scale(1);
| + | |
| − | -o-transform: scale(1);
| + | |
| − | transform: scale(1);
| + | |
| − | }
| + | |
| − | /* animate out */
| + | |
| − | .my-mfp-zoom-in.mfp-removing #small-dialog1{ | + | |
| − | -webkit-transform: scale(0.8);
| + | |
| − | -moz-transform: scale(0.8);
| + | |
| − | -ms-transform: scale(0.8);
| + | |
| − | -o-transform: scale(0.8);
| + | |
| − | transform: scale(0.8);
| + | |
| − | opacity: 0;
| + | |
| − | }
| + | |
| − | /* start state */
| + | |
| − | #small-dialog2{
| + | |
| − | background: white;
| + | |
| − | padding: 20px 30px;
| + | |
| − | text-align: left;
| + | |
| − | max-width: 400px;
| + | |
| − | margin: 40px auto;
| + | |
| − | position: relative;
| + | |
| − | border-radius:2px;
| + | |
| − | -webkit-border-radius:2px;
| + | |
| − | -moz-border-radius:2px;
| + | |
| − | -o-border-radius:2px;
| + | |
| − | }
| + | |
| − | /**
| + | |
| − | .my-mfp-zoom-in #small-dialog2{
| + | |
| − | opacity: 0;
| + | |
| − | -webkit-transition: all 0.2s ease-in-out;
| + | |
| − | -moz-transition: all 0.2s ease-in-out;
| + | |
| − | -o-transition: all 0.2s ease-in-out;
| + | |
| − | transition: all 0.2s ease-in-out;
| + | |
| − | -webkit-transform: scale(0.8);
| + | |
| − | -moz-transform: scale(0.8);
| + | |
| − | -ms-transform: scale(0.8);
| + | |
| − | -o-transform: scale(0.8);
| + | |
| − | transform: scale(0.8);
| + | |
| − | }
| + | |
| − | /* animate in */
| + | |
| − | .my-mfp-zoom-in.mfp-ready #small-dialog2 {
| + | |
| − | opacity: 1;
| + | |
| − | -webkit-transform: scale(1);
| + | |
| − | -moz-transform: scale(1);
| + | |
| − | -ms-transform: scale(1);
| + | |
| − | -o-transform: scale(1);
| + | |
| − | transform: scale(1);
| + | |
| − | }
| + | |
| − | /* animate out */
| + | |
| − | .my-mfp-zoom-in.mfp-removing #small-dialog2{
| + | |
| − | -webkit-transform: scale(0.8);
| + | |
| − | -moz-transform: scale(0.8);
| + | |
| − | -ms-transform: scale(0.8);
| + | |
| − | -o-transform: scale(0.8);
| + | |
| − | transform: scale(0.8);
| + | |
| − | opacity: 0;
| + | |
| − | }
| + | |
| − | .pop_up p a{
| + | |
| − | font-size: 1em;
| + | |
| − | color: #555555;
| + | |
| − | line-height: 1.8em;
| + | |
| − | }
| + | |
| | | | |
| | + | if ( wgPageName.substring( 0, 8) == "Template") { // if the page is a template it displays the full name in a single line |
| | + | $("#team_name").html( wgPageName ); |
| | + | } |
| | | | |
| | + | else if ( ( (wgPageName.match(/\//g) || []).length ) == 0 ) { // if it is the home page , just print the team's name |
| | + | $("#team_name").html( wgPageName.substring( 5, wgPageName.length ) ); |
| | + | } |
| | | | |
| | + | else { |
| | + | // this adds the team's name as an h1 |
| | + | $("#team_name").html( wgPageName.substring( 5 , wgPageName.indexOf("/") ) ); |
| | | | |
| − | body {
| + | // this adds the page's title as an h4 |
| − | font-family: 'Source Sans Pro', sans-serif;
| + | $("#page_name").html ( ( wgPageName.substring( wgPageName.indexOf("/") + 1, wgPageName.length ) ).replace( /\/|_/g , " ") ); |
| − | font-size: 100%;
| + | } |
| − | background: #ffffff;
| + | |
| − | }
| + | |
| − | /* ------------------------------- 3. Slider Styles ------------------------------- */ | + | |
| | | | |
| − | #fwslider {
| |
| − | position: relative;
| |
| − | width:100%;
| |
| − | }
| |
| | | | |
| − | #fwslider .slide {
| |
| − | display: none;
| |
| − | position: absolute;
| |
| − | top:0;
| |
| − | left:0;
| |
| − | z-index: 0;
| |
| − | width:100%;
| |
| − | }
| |
| | | | |
| − | #fwslider .slide img {
| |
| − | width:100%;
| |
| − | }
| |
| | | | |
| − | #fwslider .slidePrev { | + | $('#accordion').find('.menu_item').click(function(){ |
| − | background:#000;
| + | |
| − | width:50px;
| + | |
| − | height:50px;
| + | |
| − | position: absolute;
| + | |
| − | top:50%;
| + | |
| − | left:-50px;
| + | |
| − | opacity:0.5;
| + | |
| − | z-index: 10;
| + | |
| − | }
| + | |
| | | | |
| − | #fwslider .slidePrev span {
| + | //Expand or collapse this panel |
| − | background-image: url("../images/arrows.png");
| + | submenu = $(this).find('.submenu'); |
| − | width: 45px;
| + | submenu.toggle(); |
| − | height: 45px;
| + | |
| − | float: left;
| + | |
| − | background-position: -10% 50%;
| + | |
| − | background-repeat: no-repeat;
| + | |
| − | cursor: pointer;
| + | |
| − | }
| + | |
| − | #fwslider .slideNext {
| + | |
| − | background:#000;
| + | |
| − | width:50px;
| + | |
| − | height:50px;
| + | |
| − | position: absolute;
| + | |
| − | top:50%;
| + | |
| − | right:-50px;
| + | |
| − | opacity:0.5;
| + | |
| − | z-index: 10;
| + | |
| − | }
| + | |
| | | | |
| − | #fwslider .slideNext span {
| + | icon = $(this).find('.icon'); |
| − | background-image:url("../images/arrows.png");
| + | |
| − | width:45px;
| + | |
| − | height:45px;
| + | |
| − | float:left;
| + | |
| − | background-position:90% 50%;
| + | |
| − | background-repeat: no-repeat;
| + | |
| − | cursor: pointer;
| + | |
| − | }
| + | |
| | | | |
| − | #fwslider .timers {
| + | if ( !$( submenu ).is(':visible') ) { |
| − | height:4px;
| + | icon.removeClass("less").addClass("plus"); |
| − | position: absolute;
| + | } |
| − | bottom:15px;
| + | else { |
| − | right:0;
| + | icon.removeClass("plus").addClass("less"); |
| − | z-index: 3;
| + | } |
| − | } | + | |
| | | | |
| − | #fwslider .timer {
| + | //Hide the other panels |
| − | height:4px;
| + | $(".submenu").not(submenu).hide(); |
| − | width:40px;
| + | $(".icon").not(icon).removeClass("less").addClass("plus"); |
| − | background-color: #000;
| + | }); |
| − | float:left;
| + | |
| − | margin-right: 10px;
| + | |
| − | } | + | |
| | | | |
| − | #fwslider .progress {
| |
| − | height:4px;
| |
| − | width:0%;
| |
| − | background-color: #FC3;
| |
| − | float:left;
| |
| − | }
| |
| | | | |
| − | #fwslider .slide_content {
| + | $(".collapsable_menu_control").click(function() { |
| − | top:0;
| + | $(".menu_item").toggle(); |
| − | left:0;
| + | }); |
| − | position: absolute;
| + | |
| − | width:100%;
| + | |
| − | height:100%;
| + | |
| − | }
| + | |
| | | | |
| − | #fwslider .slide_content_wrap { /* Slider Text Content Container Style */
| + | $( window ).resize(function() { |
| − | max-width:1280px;
| + | $(".menu_item").show(); |
| − | margin:15% auto;
| + | }); |
| − | } | + | |
| | | | |
| − | #fwslider .title { /* Slider Title Style */
| |
| − | margin-left:4%;
| |
| − | text-transform: capitalize;
| |
| − | opacity: 0;
| |
| − | color: #fff;
| |
| − | font-size: 3em;
| |
| − | background: #febd17;
| |
| − | padding: 16px 40px;
| |
| − | float: left;
| |
| − | font-style: normal;
| |
| − | font-weight: 400;
| |
| − | -webkit-text-stroke: 0px;
| |
| − | border-radius:4px;
| |
| − | -webkit-border-radius:4px;
| |
| − | -moz-border-radius:4px;
| |
| − | -o-border-radius:4px;
| |
| − | }
| |
| | | | |
| − | #fwslider .description { /* Slider Description Style */
| + | }); |
| − | margin-left:4%; | + | |
| − | opacity: 0;
| + | |
| − | color:#ffffff;
| + | |
| − | font-size:18px;
| + | |
| − | background:#000000;
| + | |
| − | padding:10px;
| + | |
| − | clear:both;
| + | |
| − | float:left;
| + | |
| − | margin-top:20px;
| + | |
| − | line-height:24px;
| + | |
| − | font-style: normal;
| + | |
| − | font-weight: 400;
| + | |
| − | border-radius:4px;
| + | |
| − | -webkit-border-radius:4px;
| + | |
| − | -moz-border-radius:4px;
| + | |
| − | -o-border-radius:4px;
| + | |
| − | } | + | |
| − | /* ------------------------------- 4. Media Query Max Width 1300, Min Width 720 ------------------------------- */
| + | |
| − | @media only screen and (min-width:720px) and (max-width: 1300px) {
| + | |
| | | | |
| − | #fwslider .slide_content_wrap { margin-left:50px; margin-top:15%;}
| |
| − | #fwslider .title { font-size:26px; }
| |
| − | #fwslider .description { font-size:12px;}
| |
| | | | |
| − | }
| |
| | | | |
| − | /* ------------------------------- 5. Media Query Max Width 719 ------------------------------- */
| |
| | | | |
| − | @media only screen and (max-width:719px) {
| + | </script> |
| | | | |
| − | #fwslider .slide_content_wrap { display:none; }
| |
| − | #fwslider .timers { display:none; }
| |
| − | #fwslider .slide_content {cursor: pointer;}
| |
| | | | |
| − | }
| + | </html> |
