body {
    background: #fff;
    font-family: 'PT Sans', Helvetica, Arial, sans-serif;
    color: #333;
    font-size: 18px;
    padding-top:80px;
    font-weight: 300;
}
a:hover, a:focus, a, a:visited, a:active{
  text-decoration: none;
  outline: 0;
  -webkit-transition:all 0.4s ease-in-out;
    -moz-transition:all 0.4s ease-in-out;
    -o-transition:all 0.4s ease-in-out;
    transition:all 0.4s ease-in-out;
}

::-moz-selection {
	background-color: #000;
	color: #FFF;
}

::selection {
	background-color: #000;
	color: #FFF;
}

:focus {
  outline: 0;
}
.line-top {
    border-top: 4px double #dedede;
    height: 1px;
    margin: 0 auto;
    padding: 0 0 10px;
    position: relative;
    width: 65%;
    z-index: 0;
}
.line-bottom {
    border-bottom: 4px double #dedede;
    height: 1px;
    margin: 0 auto;
    padding: 10px 0 0;
    position: relative;
    width: 65%;
    z-index: 0;
}
#header{background: #343434;  /*box-shadow: 0 1px 2px #AA3423;*/}
span.dropcaps {
    float: left;
    font-size: 300%;
    font-weight: bold;
    line-height: 0.7em;
    margin: 5px 7px 0 0;
    position: relative;
}

/**** Nav bar ********/
.navbar-inner,.navbar-fixed-top .navbar-inner, .navbar-static-top .navbar-inner{
  background: none;
  border: none;
  box-shadow: none;
  -mos-box-shadow: none;
  -webkit-box-shadow: none;
  filter: none;
}
.navbar{margin-bottom: 10px;}
.navbar .brand{}
.navbar .nav > li > a{
  font: 400 14px/1.2em 'Raleway',sans-serif; 
  text-transform: uppercase; 
  letter-spacing: 0.1em; 
  text-shadow: none; 
  color: #FFF; 
  opacity: 0.5;
  text-align: center;
  line-height: 27px !important;
  margin: -10px 0;
  padding: 13px 15px;
}
.navbar .nav > li > a:hover{
  font: 400 14px/1.2em 'Raleway',sans-serif; 
  text-transform: uppercase; 
  letter-spacing: 0.1em; 
  text-shadow: none; 
  color: #FFF;
  opacity: 1;
  line-height: 27px !important;
  margin: -10px 0;
  padding: 13px 15px;
}
.navbar .nav > .active > a, .navbar .nav > .active > a:hover, .navbar .nav > .active > a:focus{
	background-color: #343434;
	box-shadow: none;
	-mos-box-shadow: none;
	-webkit-box-shadow: none;
	color: #FF9900;
	opacity: 1;
}
#about, #atom86, #team, #network, #services, .testimonials, #contact, #twitter, #twitter2{text-align: center; padding: 80px 0px 80px;}
h1.headings, h2.headings{font-family: "Raleway", sans-serif; font-size: 65px; line-height: 80px; margin-bottom: 0.5em; font-weight: 200; text-transform: uppercase;}
.headings span, .sub-headings span, .supplier_txt p span{
	color: #FF9900;
}
.sub-headings{
	font-family: "Raleway", sans-serif;
	margin: 1em 0 1.5em;
	font-weight: 200;
	text-align: center;
}


#slogan{background:  linear-gradient( rgba(0,0,0,0.2), rgba(0,0,0,0.8) ), 
url('../../assets/images/earth.jpg') 65% 35% fixed; width: 100%; height: auto; margin: 0 auto; position: relative; background-size: auto, cover; padding: 400px 0px 50px; text-align:center;}
#slogan h2.headings { color: #FFFFFF; text-shadow: 0 0px 2px #000000; font-size: 60px;}
p{color: #333333;  font: 1.3em/1.4em 'PT Sans'; letter-spacing: 0.01em;  text-align: left; font-size: 18px;}

.margin-bottom-10 {margin-bottom: 10px;}
.margin-bottom-20 {margin-bottom: 20px;}
.margin-bottom-30 {margin-bottom: 30px;}
.margin-bottom-40 {margin-bottom: 40px;}
.margin-bottom-50 {margin-bottom: 50px;}
.margin-bottom-60 {margin-bottom: 60px;}
.margin-bottom-70 {margin-bottom: 70px;}

.choices-list li{
	display:inline-block;
	vertical-align:top;
	margin:0 50px 20px 0;
}

.choices-list .visual {
	float:left;
	width:75px;
}
.choices-list .visual img{float:left;}
.choices-list .frame {overflow:hidden;}
.choices-list h3{
	font-family: 'Raleway', sans serif;
	font-weight:100;
	font-size:1.5em;
	margin:0 0 2px;
	opacity: 0.7;
	text-align: left;
}

.last{margin-right: 0px;}

#sequence .info h2, #sequence .info p{font-family: "Raleway",sans-serif; font-weight: 200;}

/* Twitter */


#twitter {background:  url('../../assets/images/pattern.png') 100% fixed, url('../../assets/images/fiber1.jpg') 50% 50% fixed repeat-y; width: 100%; height: auto; margin: 0 auto; position: relative; background-size: auto, cover;}
#twitter ul {list-style-type:none;}
#twitter ul li p.tweet {font-family: "Raleway", sans-serif; color: #FFFFFF; font-size: 31.5px; font-weight: 200; text-align:left; padding: 40px 0px 10px; list-style-type:none;word-wrap: break-word;}
#twitter ul li p.timePosted {text-shadow: none; font-size: 14px; color:#fff; padding: 0px 0px 20px;}
#twitter p.follow{font-family: "Raleway", sans-serif; font-size: 18px; color:#6CF; padding: 0px 50px 0px;}
#twitter ul a {text-decoration: none; color: #ff9900;}
#twitter ul a:hover {text-decoration: none; color: #ff9900;}
#twitter .user {text-align:left}
#twitter ul li .user img {display:none;}
#twitter ul li .user span {
	font-family: "Raleway", sans-serif; 
	color: #6cf; 
	font-size: 31.5px; 
	font-weight: 200; 
	padding: 40px 0px 10px;
}

#twitter2 {background:  url('../../assets/images/pattern.png') 100% fixed, url('../../assets/images/fiber2.jpg') 50% 50% fixed repeat-y; width: 100%; height: auto; margin: 0 auto; position: relative; background-size: auto, cover;}
#twitter2 ul {list-style-type:none;}
#twitter2 ul li p.tweet {font-family: "Raleway", sans-serif; color: #FFFFFF; font-size: 31.5px; font-weight: 200; text-align:left; padding: 40px 0px 10px; list-style-type:none;word-wrap: break-word;}
#twitter2 ul li p.timePosted {text-shadow: none; font-size: 14px; color:#fff; padding: 0px 0px 20px;}
#twitter2 p.follow{font-family: "Raleway", sans-serif; font-size: 18px; color:#6CF; padding: 0px 50px 0px;}
#twitter2 ul a {text-decoration: none; color: #ff9900;}
#twitter2 ul a:hover {text-decoration: none; color: #ff9900;}
#twitter2 .user {text-align: left}
#twitter2 ul li .user img {display:none;}
#twitter2 ul li .user span {
	font-family: "Raleway", sans-serif; 
	color: #6cf; 
	font-size: 31.5px; 
	font-weight: 200; 
	padding: 40px 0px 10px;
}

/************ Team ***********/
.team .span2{
  background: #fff;
  border:1px solid lightgrey;
/*  box-shadow: 0 0 5px #aaa;
  padding: 10px; */
  height: 100%;
}
.team .span2:hover{
	background: #fff;
	transition: all 0.2s ease-in-out 0s;
}
.team .span2:hover p{ color: #000;}
.team .span2 p{
	font-size: 16px;
	}
p.team-name {
	font-family: 'Raleway', sans-serif;
	font-size: 18px!important;
	font-weight: 200;
	margin-bottom: 4px;
	margin-top: 2px;
	text-transform: uppercase;
}
p.team-role {
  font-family: 'Raleway', sans-serif;
  font-size: 16px;
  font-weight: 400;
  font-style: italic;
  margin-bottom: 7px;
}
ul.team-social{list-style: none; margin: 10px 0;display: inline-block;}
ul.team-social li {
    display: inline;
    margin-right: 4px;
}

/******* Network ***********/

.network-list .nav li a {font-family: 'Raleway'; font-size:1.5em; color: #000;}
.network-list .nav li.active a { color: #ff9900;}	
.supplier_img  {width: 95px;}
.supplier_txt  {margin-left: 125px}
/*	.supplier_img img {width:auto; border: #F6C}*/
#op{clear:both; margin-top: 2.2em;}
#op ul { list-style:none;}

/* sorting and filtering */
.sort { display: block; font-family: 'PT Sans', Arial, sans-serif; font-size: 1.4em; line-height: 0.9em;}
.sort li a { margin-right: 4px; padding: 7px 25px; background: #AFAFAF; border-radius: 5px; color: #FFF; margin-bottom: 20px;  display: inline-block;}
.sort li a:hover { color: #ff9900; text-decoration: none; }
.sort li a.selected { background: #ff9900; }


/********* Services ****************/
#services, #about {background: #efefee;}

.services .span2 img{
	opacity:0.25;
}
.services .span2 img:hover{
	opacity:0.8;
	-webkit-transition:all 0.1s ease-in-out;
    -moz-transition:all 0.1s ease-in-out;
    -o-transition:all 0.1s ease-in-out;
    transition:all 0.1s ease-in-out;
}
	
p.service-name {
	font-family: 'Raleway', sans-serif;
	font-size: 18px!important;
	font-weight: 400;
	margin-bottom: 10px;
	margin-top: 10px;
	text-transform: uppercase;
	color:#F93;
    height: 50px;
}

.span2 p{
	text-align:center;
}

/* ----- Testimonials ----- */

.clients li {
  border: 0px solid #ccc;
  line-height: 20px;
  margin: 0px 5px;
  background: #fff;
}


.testimonial-list {
    margin-top: 30px;
	margin-bottom: 100px;
    text-align: left;
}

.testimonial-list img {
    float: left;
    margin: 10px 0 0 60px;

}

.testimonial-list p {
    padding: 0 60px 0 150px;
    font-family: Raleway;
    font-size: 22px;
    font-style: italic;
    font-weight: 200;
    line-height: 29px;
	margin-left: 40px;
}

.testimonial-list .nav {
    width: 200px;
    float: right;
    border: 0;
}

.testimonial-list .nav li {
    margin-right: 6px;
}

.testimonial-list .nav li a {
    width: 12px;
    height: 12px;
    padding: 0;
    background: #eaeaea;
    border: 0;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.testimonial-list .nav li a:hover { border: 0; background: #ddd; }
.testimonial-list .nav li.active a { background: #ff9900; }
.orange{font-weight: bold; color: #ff9900; font-size: 18px;}

.copyright .span4 {
	padding-top:15px;
}
.copyright .span4 a{
	text-align: right;
  display: block;
}

/********* Contact *********/
#contact{
  background: #222;
  color: #FFF;
}
#contact p{color: #FFF; text-align: center;}
#contact .contact-info p{text-align: center; line-height: 1.1em;}
.contact-info i{margin-right: 8px;}
.ci-title {
    font-weight: 700;
    margin-bottom: 0;
    text-transform: uppercase;
}

/************ Google maps *************/

.map {
    margin: 0px;
    height: 400px;
}

/************ Footer *****************/
.copyright {
    background: #111111;
    border-top: 1px solid #2e2f2f;
    font-size: 12px;
    padding: 5px 10px;
}
.copyright .span8 {
    padding-top: 15px;
}
.copyright p {
    color: #DADADA;
    font-size: 14px;
}
.copyright a, #contact a {
    color: #fff;
    margin: 0 5px;
}

.copyright a:hover, #contact a:hover {
    color: #ff9900;
}   
@media (max-width: 360px) {
  #testimonials h2.headings, #slogan h2.headings{font-size: 240%;}
  .navbar .brand{float: none; font-size: 34px;}
  .sub-headings{font-size: 200%;}
  .portfolio li{width: 100%; float: none;}
  .testimonial-list p { clear: both; padding: 25px 0;}
}
@media (max-width: 720px) {
   h1.headings, h2.headings, #slogan h2.headings{font-size: 280%;}
}
@media only screen and (max-width: 960px) {
   .navbar,.navbar-fixed-top{margin-bottom:0!important;}
   .navbar .btn-navbar {
        background: none;
        border: none !important;
        box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none;
        border-radius: 0;
        margin-right: 0;
        margin-top: 25px;
        padding: 10px 15px;
    }
   .collapse.in li a:hover, .navbar .nav > li > a:hover,
   .collapse.in li a.dropdown-toggle, .nav-collapse .nav > li > a:hover, .nav-collapse .dropdown-menu a:hover, 
   .nav-collapse .nav > li > a:focus, .nav-collapse .dropdown-menu a:focus, .navbar .nav > li > a:focus{background: none!important; border-bottom: 1px solid #efefef !important; color:#FF9900!important;}
   .navbar .nav > .active > a,.navbar .nav > .active > a:focus {background: #343434; border-bottom: 1px solid #efefef !important;} 
   .navbar .nav > li > a{
        background: none;
        border-bottom: 2px solid #efefef;
        box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none;
        border-radius: 0!important; -moz-border-radius: 0!important; -webkit-border-radius: 0!important;
        color: #FFF!important;
        text-decoration: none;
        text-align: left;
        clear: both;
    }
    .navbar .nav > li > a i{display: none;}
    .metaItem {
        float: none;
        margin: 20px 30px 30px;
        max-width: 100%;
    }
}

@media (min-width: 1000px){
   .portfolio li{width: 23.8467%;}
   .metaItem {
      float:right;
      width:320px;
      margin:0 30px; 
    }
}
