Template:NTNU Trondheim/css/style css

figcaption { text-align: center; font-weight: bold; }

figure img { margin: 0 auto; }

  1. globalWrapper {
  font-size: 100% !important;

}

  1. bodyContent h1, h2 {
  margin-bottom: 0 !important;
  padding:0 0 !important;
  border-bottom: 0;

}

div#content { 

  width:100% !important;

}

ul.dropdown-menu li { 

  display:block !important;

}

div.search form { 

   line-height: 1em;

}

h1, h2, h3, h4, h5, h6 { 

  font-weight: bold;

}

div.portfolio { 

  padding: 20px 75px;

}


div.about { 

  padding: 0 75px;

}

ul { 

  list-style-image: none;
  list-style-type: disc;

}

.highlightBox { 

   	width:500px; 
   	margin:auto; 
   	background-color: #F9C16E;

margin-bottom: 15px; margin-top: 15px; padding: 15px; padding-top: 5px; border-bottom-left-radius:15px; border-bottom-right-radius: 15px; border-top-left-radius: 15px; border-top-right-radius: 15px; 

}

/*-- Author: W3layouts Author URL: http://w3layouts.com License: Creative Commons Attribution 3.0 Unported License URL: http://creativecommons.org/licenses/by/3.0/ --*/ h4, h5, h6, h1, h2, h3 {margin-top: 0;} html, body{ 

font-family: 'Source Sans Pro', sans-serif;
  font-size: 100%;
  background:#fff;

} /*--header start here--*/ .header { padding: 20px 0px; } .header-main { 

 padding: 0px 25px 0px 10px;

} .logo a h1 { 

 font-size: 2em;
 font-weight: 700;
 color: #000;
 margin: 0em;

} .logo a:hover { text-decoration:none; } .header-left { float: left; padding: 5px 0px 0px 0px; } .header-right { float: right; text-align: center; padding: 50px 0px 0px 0px; } .top-nav { display: inline-block; } .top-nav ul { padding: 0px; list-style: none; } .top-nav ul li { display: inline-block; } .top-nav ul li a { font-size: 17px; font-weight: 400; padding:0px 10px; color: #777; } .top-nav ul li a:hover,.top-nav ul li a.active { text-decoration:none; color:#3488d0; } span.menu{ 

    display:none;
 }

.search { width: 100%; background: #EBEBEB; border-radius: 20px; display: inline-block; } .search input[type="text"] { border: none; background: none; outline: none; width: 80%; padding: 8px 0px 8px 12px; -webkit-appearance: none; font-size: 14px; font-weight: 400; color: #777; } .search input[type="submit"] { background:url(https://static.igem.org/mediawiki/2015/e/eb/NTNU_Trondheim_search.png)no-repeat; height:18px; border: none; width: 16%; outline: none; vertical-align:middle; } .logo { margin: 0px 5px 0px 0px; display: inline-block; } .logo a { display: block; } span.head-line { background: url(https://static.igem.org/mediawiki/2015/7/7e/NTNU_Trondheim_Bann-line.png)no-repeat 0px 0px; width: 87px; height: 18px; display: block; } /*-- responsive-mediaquries --*/ @media(max-width:1024px){

} @media(max-width:768px){

} @media(max-width:640px){ .logo { margin: 0px 5px 0px 0px; } .logo img { width: 75%; } .header-left { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; } .search input[type="text"] { padding: 6px 0px 6px 10px; } } @media(max-width:480px){ .top-nav { float: right; } .header-left { margin: 7px 0px 0px 0px; } span.dot { display: none; } .search { display: none; } span.ser-img { display: none; } .header-left { float: none; } .header-right { float: none; } .top-nav ul { 

 padding: 4px 0px 0px 0px;

} .header-main { 

 padding: 0px 0px 0px 0px;

} } @media(max-width:320px){ .header-right { float: none; padding: 10px 0px 0px 0px; text-align: left; } .top-nav ul { 

 padding: 3px 0px 0px 0px;

} .header-left img { width: 65%; } .caption { top: 15%; } span.roundplay-bwn { width: 32px; background-size: 100%; } .top-nav ul li a { font-size: 16px; padding: 0px 3px; } } /*--header end here--*/ /*--banner start here--*/ .banner { background: url(NTNU_Trondheim_Banner.jpg) no-repeat; min-height: 400px; background-size: cover; } .banner-safety { background: url(NTNU_Trondheim_Banner_safety.jpg) no-repeat; min-height: 350px; background-size: cover; } .banner1 { background: url(https://static.igem.org/mediawiki/2015/8/89/NTNU_Trondheim_b3.jpg)no-repeat; min-height: 350px; background-size: cover; } .banner2 { background: url(https://static.igem.org/mediawiki/2015/3/33/NTNU_Trondheim_b2.jpg)no-repeat; min-height: 350px; background-size: cover; }

.banner-description { background: url(NTNU_Trondheim_Banner_Description.jpg) no-repeat; min-height: 350px; background-size: cover; }

span.roundplay-bwn { background: url(https://static.igem.org/mediawiki/2015/f/f9/NTNU_Trondheim_bann-play.png)no-repeat; width: 44px; height: 44px; display: inline-block; } span.potrul-line { background: #dddbdb; width: 1px; height: 11px; display: inline-block; margin: 0px 5px 0px 2px; vertical-align: middle; } /*--- slider-css --*/ .slider { position: relative; } .rslides { 

 position: relative;
 list-style: none;
 overflow: hidden;
 width: 100%;
 padding: 0;
 margin: 0;
 }

.rslides li { 

 -webkit-backface-visibility: hidden;
 position: absolute;
 display: none;
 width: 100%;
 left: 0;
 top: 0;
 }

.rslides li:first-child { 

 position: relative;
 display: block;
 float: left;
 }

.rslides img { 

 display: block;
 height: auto;
 float: left;
 width: 100%;
 border: 0;
 }

.caption{ width: 56%; position: absolute; top: 35%; left: 16%; } .caption h3{ color: #FFF; font-weight: 300; font-size: 30px; line-height: 1.6em; } span.bg-small { background: rgba(0, 0, 0, 0.39); display: block; width: 40%; height: 48px; position: absolute; top: 83px; left: -40px; } span.bg-large { background: rgba(0, 0, 0, 0.39); display: block; width: 60%; height: 70px; position: absolute; top: 194px; left: -40px; } .caption p{ color: #FFF; line-height: 1.5em; font-size: 0.875em; margin:3em 0 1.5em 0; } a.morebtn{ background:#3D3D3D; padding:0.8em 0; display:block; font-size:0.875em; text-transform:uppercase; color:#FFF; width:20%; margin:0 auto; transition:0.5s all ease; -webkit-transition:0.5s all ease; -moz-transition:0.5s all ease; -o-transition:0.5s all ease; -ms-transition:0.5s all ease; } a.morebtn:hover{ background:#585686; } .callbacks_tabs a:after { content: "\f111"; font-size: 0; font-family: FontAwesome; visibility: visible; display: block; height: 14px; width: 14px; display: inline-block; border: 2px solid #fff; border-radius: 19px; } .callbacks_tabs a:before { content: "\f111"; font-size: 0; font-family: FontAwesome; visibility: visible; display: block; position: absolute; left: 57px; } .callbacks_here a:after{ background:#fff; } .callbacks_tabs li:nth-child(1) a:before{ content:none; } .callbacks_tabs a{ visibility:hidden; } .callbacks_tabs li{ display:inline-block; } ul.callbacks_tabs.callbacks1_tabs { position: absolute; bottom: 14px; z-index: 999; right:35px; top:485px; } /*-- responsive-mediaquries --*/ @media(max-width:1024px){ .caption { width: 63%; top: 38%; left: 19%; } ul.callbacks_tabs.callbacks1_tabs { top: 425px; } .banner { min-height: 490px; } .banner1 { min-height: 490px; } .banner2 { min-height: 490px; } } @media(max-width:768px){ .caption { width: 70%; top: 30%; left: 13%; } .caption h3{ font-size:2em; } a.morebtn { width: 26%; } span.bg-small { width: 28%; height: 25px; top: 44px; left: -30px; } span.bg-large { width: 35%; height: 40px; top: 104px; left: -30px; } .caption p { margin: 2em 0 1.5em 0; } ul.callbacks_tabs.callbacks1_tabs { top: 300px; } .callbacks_tabs a:after { height: 14px; width: 14px; } .callbacks_tabs a:before { left: 55px; } .banner { min-height: 360px; } .banner1 { min-height: 360px; } .banner2 { min-height: 360px; } } @media(max-width:640px){ .caption { width: 70%; top: 28%; left: 13%; } .caption h3{ font-size:1.8em; } a.morebtn { width: 30%; } .callbacks_tabs a:after { height: 10px; width: 10px; } .callbacks_tabs a:before { left: 53.5px; } span.bg-small { top: 40px; left: -30px; } span.bg-large { top: 93px; left: -30px; } .banner { min-height: 300px; } .banner1 { min-height: 300px; } .banner2 { min-height: 300px; } ul.callbacks_tabs.callbacks1_tabs { top: 230px; } } @media(max-width:480px){ .caption { width: 70%; top: 23%; left: 13%; } .caption p{ height:25px; overflow:hidden; margin:0.5em 0; } .caption h3{ font-size:1.6em; } a.morebtn { width: 40%; font-size:0.8em; } .callbacks_tabs a:after { height:10px; width: 10px; } ul.callbacks_tabs.callbacks1_tabs { top:175px; } span.bg-small { top: 33px; left: -20px; } span.bg-large { width: 35%; height: 27px; top: 80px; left: -20px; } .banner { min-height: 230px; 

 }
 .banner1 {

min-height: 230px; 

 }
 .banner2 {

min-height: 230px; 

 }

} @media (max-width:320px){ #slider3-pager a { width: 15%; } .rslides_tabs { bottom: 25px; } .caption { top: 25%; } .caption p{ font-size: 0.8em; height: 17px; overflow: hidden; padding: 0.2em 0 0em; margin-bottom: 0.2em; } a.readmorebtn{ font-size:0.75em; width:50%; margin-top:0.5em; padding:0.5em; } .caption h3 { font-size: 1em; } ul.callbacks_tabs.callbacks1_tabs { top: 115px; } .banner { min-height: 170px; 

 }
 .banner1 {

min-height: 170px; 

 }
 .banner2 {

min-height: 170px; 

 }
 .header {

padding: 10px 0px; } span.roundplay-bwn { 

 width: 25px;
 height: 25px;
 background-size: 100%;

} } /*--banner end here--*/ /*--port folio start here--*/ .portfolio { position: relative; } small.port-play { background: url(https://static.igem.org/mediawiki/2015/0/0f/NTNU_Trondheim_port-play.png)no-repeat; width: 44px; height: 44px; display: block; margin: 0 auto; } .port-name { float: left; margin: 85px 0px 0px 0px; } .port-name p { font-size: 13px; color: #999; display: inline-block; } span.port-lady { background: url(../images/hover-img.png)no-repeat; width: 50px; height: 50px; display: inline-block; border-radius: 31px; margin: 0px 0px 0px 16px; vertical-align: middle; } .port-like { float: right; margin: 85px 0px 0px 0px; } span.hover-line { background: url(https://static.igem.org/mediawiki/2015/6/6b/NTNU_Trondheim_port-line.png)no-repeat; width: 26px; height: 1px; display: block; margin: 7px auto 10px; } .port-nav-left { 

 text-align: center;
 padding: 2em 0em 2em 0em;

} .port-nav-left h6 { font-size: 32px; font-weight: 600; color: #000; margin: 0px 0px 10px 32px; font-family: 'Roboto Condensed', sans-serif; } .port-nav-left p { 

 font-size: 16px;
 font-weight: 400;
 color: #303030;
 width: 65%;
 margin: 0 auto;
 line-height: 1.8em;

} span.port-ladyimg { background: url(../images/hover-img.png)no-repeat; width: 50px; height: 50px; display: inline-block; vertical-align: middle; border-radius: 32px; float: left; } span.heart { background: url(../images/heart.png)no-repeat; width: 46px; height: 16px; display: block; } .porthover-left p { font-size: 15px; font-weight: 600; color: #999; display: inline-block; } .porthover-left { float: left; width: 75%; } .porthover-right { float: right; width: 20%; padding: 17px 0px 0px 0px; } .work-column { position: relative; } .porthover { background: rgba(255, 255, 255, 0.88); position: absolute; display: none; width: 100%; height: 100%; top: 0; } .work-column:hover div.porthover{ display:block; } .porthover-grids { padding: 85px 0px 0px 0px; } .porthover h3 { font-size: 15px; font-weight: 600; color: #999; text-align: center; padding: 55px 0px 0px 0px; }

.porthover-grids { padding: 140px 0px 0px 0px; } .pa-more { 

 padding: 0px;

} /*-- MIXTUP PART --*/ /* Strip /*-----------------------------------------------------------------------------------*/ .b-link-stripe{ position:relative; display:inline-block; vertical-align:top; font-family: 'Open Sans', sans-serif; font-weight: 300; overflow:hidden; }

.b-link-stripe .b-line{ position:absolute; top:0; bottom:0; width:20%; background:rgba(15, 207, 140, 0.9); transition:all 0.5s linear; -moz-transition:all 0.5s linear; -ms-transition:all 0.5s linear; -o-transition:all 0.5s linear; -webkit-transition:all 0.5s linear; opacity:0; visibility:hidden; /* lt-ie9 */ } /*-----------------------------------------------------------------------------------*/ /* Animation effects /*-----------------------------------------------------------------------------------*/ .b-animate-go{ text-decoration:none; } .b-animate{ transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; -o-transition: all 0.5s; -webkit-transition: all 0.5s; visibility: hidden; font-size:1.1em; font-weight:700; } .b-animate img{ margin-top:0%; display: -webkit-inline-box; } h2.b-animate.b-from-left.b-delay03 { padding-top: 0em; font-size: 15px; color: #7E7C7C; } /* lt-ie9 */ .b-animate-go:hover .b-animate{ visibility:visible; } .b-from-left{ position:relative; left:-100%; } .b-animate-go:hover .b-from-left{ left:50%; top:-125px; } span.m_4{ font-size:14px; font-weight:400; } p.m_5 { margin: 2% auto 5%; width: 70%; color: #283A47; font-size: 1.1em; font-weight: 600; line-height: 1.5em; text-align: center; }

/*--team--*/ .team{ background:#fff; padding:0 0 9% 0; } .col_1_of_4:first-child { margin-left: 0; } .span_1_of_4 { width: 22.8%; } .col_1_of_4 { display: block; float: left; margin: 1% 0 1% 2.6%; background: #FFF; } /* lt-ie9 */ .b-link-stripe:hover .b-line{ visibility:visible; } .b-link-stripe .b-line1{ left:0; } .b-link-stripe .b-line2{ left:20%; transition-delay:0.1s !important; -moz-transition-delay:0.1s !important; -ms-transition-delay:0.1s !important; -o-transition-delay:0.1s !important; -webkit-transition-delay:0.1s !important; } .b-link-stripe .b-line3{ left:40%; transition-delay:0.2s !important; -moz-transition-delay:0.2s !important; -ms-transition-delay:0.2s !important; -o-transition-delay:0.2s !important; -webkit-transition-delay:0.2s !important; } .b-link-stripe .b-line4{ left:60%; transition-delay:0.3s !important; -moz-transition-delay:0.3s !important; -ms-transition-delay:0.3s !important; -o-transition-delay:0.3s !important; -webkit-transition-delay:0.3s !important; } .b-link-stripe .b-line5{ left:80%; transition-delay:0.4s !important; -moz-transition-delay:0.4s !important; -ms-transition-delay:0.4s !important; -o-transition-delay:0.4s !important; -webkit-transition-delay:0.4s !important; } .b-link-stripe:hover .b-line{ opacity:1; }

/* Self Clearing Goodness */ .container:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; } .clearfix:before, .clearfix:after, .row:before, .row:after { 

 content: '\0020';
 display: block;
 overflow: hidden;
 visibility: hidden;
 width: 0;
 height: 0; }

.row:after, .clearfix:after { 

 clear: both; }

.row, .clearfix { 

 zoom: 1; }

.clear { 

 clear: both;
 display: block;
 overflow: hidden;
 visibility: hidden;
 width: 0;
 height: 0;

} /*-- MIXTUP PART --*/ @media (max-width:1440px){ h2.b-animate.b-from-left.b-delay03 { padding-top: 0em; } .porthover-grids { padding: 94px 0px 0px 0px; } .b-animate img { margin-top: -3%; } } @media (max-width:1366px){ .porthover-grids { padding: 87px 0px 0px 0px; } } @media (max-width:1280px){ h2.b-animate.b-from-left.b-delay03 { padding-top: 0em; position: absolute; top: 31%; } .porthover-grids { padding: 70px 0px 0px 0px; } .b-animate img { margin-top: 65%; } } @media (max-width:1024px){ h2.b-animate.b-from-left.b-delay03 { padding-top: 0em; }

  1. toTop {

right: 460px; } .porthover h3 { padding: 35px 0px 0px 0px; } span.port-lady { width: 35px; height: 35px; background-size: 100%; margin: 0px 0px 0px 5px; } .porthover-right { padding: 10px 0px 0px 0px; } .porthover-grids { padding: 46px 0px 0px 0px; } .b-animate img { margin-top: 35%; } .port-nav-left p { 

 width: 87%;

} } @media (max-width:768px){ h2.b-animate.b-from-left.b-delay03 { padding-top: 0em; } small.port-play { width: 32px; height: 32px; background-size: 100%; }

  1. toTop {

right: 330px; } .port-strip { height: 45px; } .porthover-grids { padding: 115px 0px 0px 0px; } .porthover h3 { padding: 66px 0px 0px 0px; font-size: 16px; } .porthover-right { padding: 10px 0px 0px 0px; }

  1. portfoliolist .portfolio {

width: 50%; } .work-column { 

 float: left;
 width: 50%;

} } @media (max-width:640px){ h2.b-animate.b-from-left.b-delay03 { font-size: 12px; padding-top: 0em; } small.port-play { width: 28px; } .port-strip { display: none; } .porthover-grids { padding: 86px 0px 0px 0px; } span.port-lady { width: 26px; height: 26px; background-size: 100%; } .porthover-right { padding: 4px 0px 0px 0px; } } @media (max-width:480px){ h2.b-animate.b-from-left.b-delay03 { padding-top: 0em; font-size: 12px; } .port-strip { height: 40px; } span.scroller { width: 25px; background-size: 100%; } .porthover h3 { font-size: 12px; } span.hover-line { margin: 0px auto 6px; } .b-animate img { margin-top: 15%; } .porthover h3 { padding: 30px 0px 0px 0px; } .porthover-grids { padding: 60px 0px 0px 0px; } .porthover-right { margin: 0px 4px 0px 0px; } .port-nav-left h6 { 

 font-size: 26px;

} } @media (max-width:320px){

span.potrul-line { height: 13px; margin: 0px 0px 0px 0px; } .port-nav-left p { font-size: 13px; width: 90%; line-height:1.5em; } .port-nav-left { 

 padding: 1em 0em 1em 0em;

}

h2.b-animate.b-from-left.b-delay03 { padding-top: 0em; font-size: 10px; } small.port-play { width: 20px; } span.hover-line { margin: 5px auto 7px; } .port-strip { display: none; } .porthover h3 { padding: 35px 0px 0px 0px; } .porthover-grids { display: none; } span.port-lady { display: none; }

  1. filters li {

margin: 0px 2px 0px 0px; } } /*--port folio end here--*/ /*--footer start here--*/ .footer { padding: 20px 0px; } .footer-main p { font-size: 16px; font-weight: 400; color: #000; text-align: center; } .footer-main p a{ font-size: 16px; font-weight: 400; color:#00aee1; } .footer-main p a:hover{ text-decoration:none; color:#000; } @media (max-width:320px){ .footer-main p { font-size: 14px; } .footer-main p a{ font-size: 14px; } } /*--footer end here--*/ /*--about start here--*/ .about { 

 background: #EBEBEB;
 padding: 50px 0px 50px 0px;

} .about-top { 

 text-align: center;

} .about-top h3 { 

 font-size: 35px;
 font-weight: 600;
 color: #000;
 font-family: 'Roboto Condensed', sans-serif;

} .about-top p { 

 font-size: 16px;
 font-weight: 400;
 color: #303030;
 line-height: 1.8em;
 width: 80%;
 margin: 0 auto;

} .about-top { 

 text-align: center;
 padding: 0em 0em 3em 0em;

} .about-right h4 { 

 font-size: 25px;
 font-weight: 400;
 color: #303030;

} .about-right p { 

 font-size: 16px;
 font-weight: 400;
 color: #303030;
 line-height: 1.8em;

} .about-left img { 

 border-radius: 5px;

} .about-left { 

 padding: 0px;

} .our-team h3 { 

 font-size: 30px;
 font-weight: 600;
 color: #000;
 margin: 0em 0em 1em 0em;

} .team-grid { 

 width: 23.8%;
 padding: 0em;
 margin: 1em;

} .mar-more { 

 margin: 0em;

} .team-grid img { 

 border-radius: 5px 5px 0px 0px;

} .team-details { 

 text-align: center;
 padding: 1em 1em;
 background: #fff;
 border-radius: 0px 0px 5px 5px;

} .team-details h4 { 

 font-size: 20px;
 font-weight: 400;
 color: #000;
 margin: 0em 0em 0.1em 0em;
 font-family: 'Roboto Condensed', sans-serif;

} .team-details p { 

 font-size: 15px;
 font-weight: 400;
 color: #303030;

} @media (max-width:1024px){ .team-grid img { 

 width: 100%;

} .team-grid { 

 width: 22.8%;

} .about-left img { 

 width: 100%;

} .about-right h4 { 

 font-size: 23px;

} .about-right p { 

 font-size: 16px;

} } @media (max-width:768px){ .about-top p { 

 width: 95%;

} .about-left { 

 text-align: center;

} .about-left img { 

 width: 80%;

} .about-top { 

 padding: 0em 0em 1.5em 0em;

} .about-right { 

 padding: 2em 0em 0em 0em;

} .team-grid { 

 width: 48.8%;
 float: left;
 margin: 0em 1em 1em 0em;

} .mar-more { 

 margin: 0em;

} .ma-more { 

 margin: 0em 0em 1em 0em;

} .about-right p { 

 font-size: 16px;

} .our-team { 

 margin: 2em 0em 2em 0em;

} } @media (max-width:640px){ .team-grid { 

 width: 47.8%;

} } @media (max-width:480px){ .logo a h1 { 

 font-size: 1.7em;

} .about { 

 padding: 30px 0px 15px 0px;

} .about-top h3 { 

 font-size: 23px;

} .about-right { 

 padding: 1em 0em 0em 0em;

} .about-right h4 { 

 font-size: 19px;

} .our-team { 

 margin: 1em 0em 1em 0em;

} .our-team h3 { 

 font-size: 22px;

} .team-grid { 

 width: 48%;

} .team-details h4 { 

 font-size: 17px;

} .team-details { 

 padding: 0.5em 0.5em;

} .about-right p { 

 font-size: 15.4px;

} } @media (max-width:320px){ .logo a h1 { 

 font-size: 1.3em;

} .about { 

 padding: 20px 0px 15px 0px;

} .about-top p { 

 font-size: 13px;
 width: 100%;
 line-height: 1.6em;

} .about-right p { 

 font-size: 13px;
 line-height: 1.6em;

} .team-grid { 

 width: 100%;
 margin: 1em auto 0em;

} .our-team h3 { 

 margin: 0em 0em 0em 0em;

} .about-top { 

 padding: 0em 0em 0.5em 0em;

} .about-left img { 

 width: 100%;

} .about-right h4 { 

 font-size: 17px;
 margin: 0em 0em 0.4em 0em;

} } /*--about end here--*/ /*--message start here--*/ .message { background: #EBEBEB; padding: 20px 0px 60px 0px; } .message-top h3 { font-size: 35px; font-weight: 600; color: #000; } .message-top p { font-size: 16px; font-weight: 400; color: #000; line-height: 1.8em; } .message-top ul { margin: 30px 0px 0px 0px; } .message-top ul li { margin: 0px 0px 13px 0px; } .message-top ul li a { font-size: 15.5px; font-weight: 400; color: #000; } .message-top ul li a:hover { text-decoration:none; color: #999; } .message-bottom { padding: 50px 0px 0px 0px; } .message-right input[type="text"] { outline: none; width: 48%; padding: 8px; border: 1px solid #999; -webkit-appearance: none; font-size: 16px; font-weight: 500; color: #000; margin: 0px 10px 5px 0px; background: none; } .con-addr { margin: 15px 0px 0px 0px; } .con-addr h4 { font-size: 22px; font-weight: 600; color: #000; margin: 0px 0px 5px 0px; font-family: 'Roboto Condensed', sans-serif; } .con-addr p { font-size: 15px; font-weight: 400; color: #303030; line-height: 1.8em; } .con-addr p a { font-size: 15px; color: #000; } .con-addr p a:hover{ text-decoration:none; color: #3488d0; } .message-right input.mar-last { 

 margin: 0px;

} .message-right textarea { font-size: 16px; font-weight: 500; padding: 10px; width: 98.5%; height: 13em; margin: 7px 0px; background: none; resize: none; outline: none; -webkit-appearance: none; } .message-right input[type="submit"] { font-size: 15px; font-weight: 400; color: #fff; background: #F9C16E; padding: 8px 22px; outline: none; border: none; -webkit-appearance: none; border-radius: 5px; 

 -webkit-border-radius: 5px;
 -moz-border-radius: 5px;
 -o-border-radius: 5px;

} .message-right input[type="submit"]:hover { background:#000; transition: 0.5s all; 

-webkit-transition: 0.5s all;
-moz-transition:  0.5s all;
-o-transition:  0.5s all;

} .con-info h3 { font-size: 30px; font-weight: 600; color: #000; margin: 0px 0px 7px 0px; font-family: 'Roboto Condensed', sans-serif; } .con-info p { font-size: 16px; font-weight: 400; color:#303030; line-height: 1.8em; } .map iframe { width: 100%; height: 300px; padding: 70px 20px 0px 13px; border: none; } @media (max-width:1024px){ .message-right textarea { 

 width: 98.8%;

} } @media (max-width:768px){ .message-top h3 { font-size: 30px; } .message { padding: 40px 0px 40px 0px; } .message-right { float: right; width: 60%; } .message-left { float: left; width: 40%; } .con-info h3 { font-size: 25px; } .con-info p { font-size: 15px; } .message-right input[type="text"] { padding: 6px; font-size: 14px; } .message-right textarea { 

 width: 99%;

} } @media (max-width:640px){ .message-top h3 { font-size: 26px; } .message-top ul { margin: 15px 0px 0px 0px; } .message-top ul li { margin: 0px 0px 7px 0px; } .message-left { float: none; width: 100%; margin: 0px 0px 30px 0px; } .message-right { float: none; width: 100%; } .message-bottom { padding: 20px 0px 0px 0px; } .message-right input[type="text"] { width: 48.7%; } .message-right textarea { width: 99.5%; } .map iframe { height: 260px; padding: 25px 12px 0px 12px; } } @media (max-width:480px){ .message { padding: 15px 0px 30px 0px; } .message-top h3 { font-size: 23px; margin: 5px 0px 0px 0px; } .message-top p { font-size: 15px; overflow: hidden; height: 80px; } .message-right input[type="text"] { width: 100%; margin: 7px 0px 0px 0px; } .message-right textarea { font-size: 15px; width: 99.8%; } .message-right input[type="submit"] { font-size: 12px; } .map iframe { height: 250px; padding: 15px 12px 0px 12px; } } @media (max-width:320px){ .message-top h3 { font-size: 20px; margin: 0px 0px 0px 0px; } .message-top p { font-size: 14px; height: 48px; line-height: 1.6em; } .message-top ul { margin: 5px 0px 0px 0px; padding: 0px 0px 0px 25px; } .message-bottom { padding: 10px 0px 0px 0px; } .con-info h3 { font-size: 20px; } .con-info p { font-size: 14px; line-height: 1.6em; } .message-left { margin: 0px 0px 15px 0px; padding: 0px; } .message-right input[type="text"] { padding: 5px; font-size: 13px; } .message-right textarea { height: 7em; padding:5px; } .map iframe { height: 150px; } .message-right { 

 padding: 0px;

} .map iframe { 

 padding: 16px 0px 0px 0px;

} } /*--message end here--*/ /*--friends start here--*/ .friend { padding: 50px 0px; background: #EBEBEB; } .friend-top { padding: 0px 0px 30px 0px; text-align: center; } .friend-top h3 { font-size: 35px; font-weight: 600; color: #000; font-family: 'Roboto Condensed', sans-serif; } .friend-top p { font-size: 16px; font-weight: 400; color: #303030; line-height:1.8em; width: 80%; margin: 0 auto; } .friend-bott-grids { padding: 0px 0px 17px 0px; } @media (max-width:1024px){ .friend-wrapper { width: 32%; margin: 0px 12px 0px 0px; } .friend-wrapper img { width: 100%; } } @media (max-width:768px){ .friend-top h3 { font-size: 30px; } .friend { padding: 30px 0px; } .friend-top p { font-size: 15px; width: 95%;

} .friend-wrapper { width: 31%; float:left; padding: 0px; } } @media (max-width:640px){ .friend-top h3 { font-size: 26px; } .friend-top p { font-size: 15px; } } @media (max-width:480px){ .friend-top h3 { font-size: 22px; } .friend-wrapper { width: 100%; margin: 5px auto; text-align: center; } .friend-wrapper img{ margin: 0 auto; } } @media (max-width:320px){ .friend { padding: 20px 0px 30px 0px; } .friend-wrapper:nth-of-type(3) { display: none;

} .friend-top p { line-height:1.6em; font-size: 13px; } .friend-top{ padding:0px 0px 15px 0px } } /*--friends end here--*/