/* Required */
/*  ------------------------------------------------------------------
  
@library :      CNN Grid System - SASS
@version :      0.0.0.1
@description :  System for managing breakpoints and
	            responsive grid columns.

@author :       Kenneth Uzquiano (kenneth.uzquiano@gmail.com)

------------------------------------------------------------------ */
    /*  BASE VALUES
		-----------
		All default values for generating the grid can be found in the
		'lib/vars' file. They can also be overidden by the project's vars file.
		Here is a brief description of what each variable within this file does.
		These variables are global, as they need to be used from mixin to mixin,
		but are calculated at each grid change, thus, do not need to be initialized.
		
		    $grid-id :              Active grid id
		    $grid-active :          Active grid
		    $grid-columns :         Number of columns in active grid
		    $grid-column-width :    Width of a column based on units below
		    $grid-query :           Media query for active grid
		    $grid-full-width :      Full width of active grid
    */
    /*  -------------------------------
	                MIXINS
		-------------------------------

		@mixin :                @mixin breakpoint( $breakpointId: mobile )
		@description :          Define active grid by id
		@param $breakpointId :  Id of grid to activate (default : mobile)
		@param $retina :        Include media queries for retina displays (default : false)
    */
/* 20px */
    /*  
    	@mixin :                @mixin grid-col( $col: 1 )
		@description :          Calculate widths of grid columns based on px, ems, or %
		@param $col :           Number of columns to calculate width (default : 1)
		@param $fluid :         Calculate using percentages vs em / px (default : true)
	*/
/*
	@mixin :                @mixin grid-row( $fluid: true )
	@description :          Define a row to house columned elements
	@param $fluid :         Calculate using percentages vs em / px (default : true)
*/
/*
	---------------------------------
	           FUNCTIONS
	---------------------------------
*/
/*
	@function :         -fn-findGridById( $gridID: mobile )
	@description :      Define active grid by id
	@param $gridId :    Id of grid to activate
*/
/*
	@function :         -fn-setGridProperties($p_grid)
	@description :      Set properties based on active grid
	@param $p_grid :    Grid to use to set properties
*/
/*
	@function :         -fn-getStaticWidth($col: 1)
	@description :      Calculate and return the static width of columns.
	@param $col :       Number of columns to use to calculate static width.
*/
/*
	@function :         -fn-getFluidWidth($col: 1)
	@description :      Calculate and return the fluid width of columns.
	@param $col :       Number of columns to use to calculate fluid width.
*/
/*
	@function :         -fn-getStaticMargin()
	@description :      Calculate and return the static margin
	@param :            null
*/
/*
	@function :         -fn-getFluidMargin()
	@description :      Calculate and return the fluid margin
	@param :            null
*/
body {
  font-size: 16px;
  font-family: CNN,"Helvetica Neue",Helvetica,Arial,Utkal,sans-serif; }
  body * {
    box-sizing: border-box; }

/* Set up flexible containers */
.interactive-container,
.cnn-outbrain,
#comments,
#disqus_thread {
  margin: 0 auto;
  width: 95%;
  max-width: 980px; }

/* ------------ MOBILE / DEFAULT STYLES ------------ */
h1 {
  font-size: 1.75rem;
  line-height: 1.21429;
  padding: 10px 0 0;
  font-weight: 300;
  margin: 10px 0; }

.metadata {
  color: #737373;
  font-weight: 400;
  font-size: .75rem;
  line-height: 1.5; }
  .metadata p {
    margin-bottom: 0; }
  .metadata__byline {
    font-weight: 700;
    padding-bottom: 0; }
    .metadata__byline a {
      color: #006598; }
  .metadata:after {
    clear: both;
    content: '';
    display: table; }

p {
  padding: 0 10px 18px 0; }

/* ------------ TABLET STYLES ------------ */
/* md 10 screen and (min-width: 30em) */
@media screen and (min-width: 30em) {
  h1 {
    font-size: 3.25rem;
    line-height: 1.07692;
    padding: 10px 0 0;
    font-weight: 300;
    margin: 10px 0; }

  .metadata {
    color: #737373;
    font-weight: 400;
    font-size: .875rem;
    line-height: 1.57143; }
    .metadata p {
      margin-bottom: 0; }
    .metadata__byline {
      font-weight: 700;
      padding-bottom: 0; }
      .metadata__byline a {
        color: #006598; }
    .metadata:after {
      clear: both;
      content: '';
      display: table; } }
/* ------------ DESKTOP STYLES ------------ */
/* lg 12 screen and (min-width: 48em) */
@media screen and (min-width: 48em) {
  h1 {
    font-size: 3.875rem;
    line-height: 1.06452;
    padding: 10px 0 0;
    font-weight: 300;
    margin: 10px 0; }

  .metadata {
    color: #737373;
    font-weight: 400;
    font-size: 1rem;
    line-height: 1.5; }
    .metadata p {
      margin-bottom: 0; }
    .metadata__byline {
      font-weight: 700;
      padding-bottom: 0; }
      .metadata__byline a {
        color: #006598; }
    .metadata:after {
      clear: both;
      content: '';
      display: table; } }
/* CNN Sharebar */
.share-container {
  position: relative; }
  .share-container .share-bar {
    width: auto;
    display: inline-block;
    float: none;
    margin: 0; }
    .share-container .share-bar li.share-button {
      width: 35px;
      height: 35px;
      float: right;
      margin-right: 15px;
      cursor: pointer;
      list-style-type: none;
      -webkit-transition: transform 0.5s ease 0s;
      transition: transform 0.5s ease 0s; }
      .share-container .share-bar li.share-button.email {
        background: url("http://i.cdn.turner.com/cnn/.e/img/4.0/interactive/sharebar/email.png");
        background-size: 35px 35px; }
      .share-container .share-bar li.share-button.facebook {
        background: url("http://i.cdn.turner.com/cnn/.e/img/4.0/interactive/sharebar/facebook.png");
        background-size: 35px 35px; }
      .share-container .share-bar li.share-button.twitter {
        background: url("http://i.cdn.turner.com/cnn/.e/img/4.0/interactive/sharebar/twitter.png");
        background-size: 35px 35px; }
      .share-container .share-bar li.share-button:hover {
        transform: scale(1.2, 1.2);
        -webkit-transform: scale(1.2, 1.2); }

/*---------------
TABLET
---------------*/
/* md 10 screen and (min-width: 30em) */
@media screen and (min-width: 30em) {
  .share-container {
    position: relative;
    clear: both;
    margin-top: 0px; }
    .share-container .share-bar {
      width: auto;
      display: inline-block; }
      .share-container .share-bar li.share-button {
        width: 35px;
        height: 35px;
        float: right;
        margin-right: 15px;
        cursor: pointer;
        list-style-type: none;
        -webkit-transition: transform 0.5s ease 0s;
        transition: transform 0.5s ease 0s; }
        .share-container .share-bar li.share-button.email {
          background: url("http://i.cdn.turner.com/cnn/.e/img/4.0/interactive/sharebar/email.png");
          background-size: 35px 35px; }
        .share-container .share-bar li.share-button.facebook {
          background: url("http://i.cdn.turner.com/cnn/.e/img/4.0/interactive/sharebar/facebook.png");
          background-size: 35px 35px; }
        .share-container .share-bar li.share-button.twitter {
          background: url("http://i.cdn.turner.com/cnn/.e/img/4.0/interactive/sharebar/twitter.png");
          background-size: 35px 35px; }
        .share-container .share-bar li.share-button:hover {
          transform: scale(1.2, 1.2);
          -webkit-transform: scale(1.2, 1.2); } }
/*---------------
DESKTOP
---------------*/
/* lg 12 screen and (min-width: 48em) */
@media screen and (min-width: 48em) {
  .share-container {
    margin-left: 0; }
    .share-container .share-bar {
      width: auto;
      display: inline-block; }
      .share-container .share-bar li.share-button {
        width: 35px;
        height: 35px;
        float: right;
        margin-right: 15px;
        cursor: pointer;
        list-style-type: none;
        -webkit-transition: transform 0.5s ease 0s;
        transition: transform 0.5s ease 0s; }
        .share-container .share-bar li.share-button.email {
          background: url("http://i.cdn.turner.com/cnn/.e/img/4.0/interactive/sharebar/email.png");
          background-size: 35px 35px; }
        .share-container .share-bar li.share-button.facebook {
          background: url("http://i.cdn.turner.com/cnn/.e/img/4.0/interactive/sharebar/facebook.png");
          background-size: 35px 35px; }
        .share-container .share-bar li.share-button.twitter {
          background: url("http://i.cdn.turner.com/cnn/.e/img/4.0/interactive/sharebar/twitter.png");
          background-size: 35px 35px; }
        .share-container .share-bar li.share-button:hover {
          transform: scale(1.2, 1.2);
          -webkit-transform: scale(1.2, 1.2); } }
/* Project-level vars */
/* 
    CNN Colors
    based on swatches from Data vis style guide
    (http://docs.turner.com/display/cnndxg/Data+Visualisation+style+guide)
*/
a {
  text-decoration: none;
  color: #006598; }

body {
  color: #262626; }

.i-updated {
  font-size: 14px;
  color: #8C8C8C;
  padding: 0;
  margin: 0; }

ul {
  padding-left: 0; }

.cnn-outbrain {
  margin-top: 50px; }

.cnn_clear:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0; }

.cnn_clear {
  display: inline-block; }

#cnnint-nuclear-club {
  position: relative;
  min-height: 500px;
  padding-top: 50px; }

#overview-panel table {
  width: 100%;
  border-top: 1px solid #e1e1e1;
  border-bottom: 1px solid #e1e1e1;
  border-collapse: collapse;
  margin-top: 15px; }

#overview-panel table th {
  text-transform: uppercase;
  color: #8C8079; }

#country-panel {
  display: none; }

#overview-panel table th, #overview-panel table td {
  border: 1px solid #e1e1e1;
  padding: 5px 10px; }

#nuclear-nav {
  width: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
  height: 50px;
  #background: url("http://i.cdn.turner.com/cnn/interactive/2013/03/world/nuclear-weapon-states/images/nav-bg-gradient.png") repeat-x top left #dadada;
  list-style-type: none;
  border-top: 1px solid #8c8079;
  border-bottom: 1px solid #8c8079; }

#nuclear-nav li {
  display: inline;
  font-size: 18px;
  color: #8c8079;
  position: relative;
  top: 10px;
  margin-left: 18px;
  padding-right: 18px;
  border-right: 1px solid #8c8079;
  cursor: pointer; }

#country-nav {
  width: 100%;
  list-style-type: none;
  border-bottom: 1px solid #dadada;
  overflow: hidden;
  display: none; }

#country-nav li {
  display: inline;
  font-size: 12px;
  position: relative;
  top: 8px;
  margin-left: 12px;
  padding: 8px 12px 8px 0px;
  border-right: 1px solid #dadada;
  font-weight: bold; }

#country-nav li a.active {
  color: #ca0000; }

#nav-carat {
  position: absolute;
  z-index: 999;
  bottom: -4px;
  left: 50px; }

#nav li:last-of-type {
  border: none !important; }

#nav li.active {
  font-weight: bold;
  color: #403A37; }

td.confirmed {
  color: #ca0000; }

td.unconfirmed {
  color: #ff861c; }

td.pursuing {
  color: #FFD648; }

.nc-key {
  display: inline;
  float: right;
  font-size: 12px;
  line-height: 16px;
  margin-top: 15px; }

.nc-key li {
  display: inline;
  float: left;
  margin: 0 10px 0 0;
  font-weight: bold; }

.nc-key img {
  background-color: #ca0000;
  display: inline-block;
  height: 16px;
  margin: 0 8px 0 0;
  overflow: hidden;
  vertical-align: -3px;
  width: 16px; }

#nc-overview {
  margin: 20px 0px;
  width: 100%;
  height: auto; }

.nc-key-country {
  font-size: 13px;
  line-height: 16px;
  margin-bottom: 15px; }

.nc-key-country li {
  display: inline;
  margin: 0 10px 10px;
  font-weight: bold; }

.nc-key-country img {
  background-color: #ca0000;
  display: inline-block;
  height: 16px;
  margin: 0 8px 0 0;
  overflow: hidden;
  vertical-align: -3px;
  width: 16px; }

/* Country panel styling */
#country-name {
  font-size: 16px;
  font-weight: bold;
  padding: 0 10px 10px; }

.country-meta {
  width: 100%;
  padding-left: 10px;
  float: none; }
  .country-meta img {
    width: 100%; }

.country-meta-full {
  width: 100%;
  padding: 10px;
  clear: both; }

.country-meta-full h3 {
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 10px; }

.country-meta p {
  font-size: 14px;
  line-height: 18px;
  margin-top: 0;
  padding-left: 10px; }

.country-meta h3 {
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 10px; }

#country-meta-table {
  width: 100%;
  border: 1px solid #e1e1e1;
  padding: 5px 10px;
  font-weight: bold;
  margin-bottom: 10px;
  border-collapse: collapse; }

#country-meta-table th, #country-meta-table td {
  border: 1px solid #e1e1e1;
  padding: 5px 10px;
  font-weight: bold; }

#country-meta-table th {
  text-transform: uppercase;
  color: #8C8079; }

#nc-country-warheads {
  width: 100%;
  height: auto;
  float: left;
  margin-right: 15px; }

h4.metaHead {
  text-transform: uppercase;
  color: #8c8079;
  margin: 0;
  padding: 0;
  font-size: 12px; }

.totalArsenal {
  color: #ca0000;
  padding-bottom: 4px; }

.reserveRetire {
  color: #8c8079; }

#nc-country-warheads ul li span {
  font-size: 16px; }

#nc-country-warheads ul {
  list-style-type: none;
  text-transform: none;
  font-weight: bold;
  padding-right: 10px; }

#nc-country-warheads ul li.description {
  font-weight: normal !important;
  text-transform: none !important;
  line-height: 1.5; }

#nc-country-warheads ul li.source {
  font-weight: normal !important;
  text-transform: none !important;
  line-height: 16px;
  font-size: 12px;
  color: #666666;
  padding-top: 4px; }

#nc-deliverymech {
  width: 310px;
  float: left; }

#nc-deliverymech {
  float: left; }

.nuclear-custom-item {
  margin: 0 0 15px;
  position: relative;
  height: 360px;
  padding-top: 15px;
  border-top: 1px solid #d9d9d7; }

.nuclear-custom-item h3, .nuclear-custom-item p {
  width: 280px; }

.nuclear-custom-item p {
  padding-left: 0px !important; }

.nuclear-custom-item img {
  position: absolute;
  top: 15px;
  right: 0px; }

.sourceLine {
  display: block;
  clear: both;
  font-size: 12px;
  color: #666666;
  padding: 10px;
  text-align: right;
  margin-top: 15px; }

/*
======================
======================
======================
Bigger than mobile, yo
======================
======================
======================
*/
/* lg 12 screen and (min-width: 48em) */
@media screen and (min-width: 48em) {
  #cnnint-nuclear-club {
    position: relative;
    min-height: 500px;
    padding-top: 50px; }

  #overview-panel table {
    width: 100%;
    border-top: 1px solid #e1e1e1;
    border-bottom: 1px solid #e1e1e1;
    border-collapse: collapse;
    margin-top: 15px; }

  #overview-panel table th {
    text-transform: uppercase;
    color: #8C8079; }

  #country-panel {
    display: none; }

  #overview-panel table th, #overview-panel table td {
    border: 1px solid #e1e1e1;
    padding: 5px 10px; }

  #nuclear-nav {
    width: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    height: 50px;
    #background: url("http://i.cdn.turner.com/cnn/interactive/2013/03/world/nuclear-weapon-states/images/nav-bg-gradient.png") repeat-x top left #dadada;
    list-style-type: none;
    border-top: 1px solid #8c8079;
    border-bottom: 1px solid #8c8079; }

  #nuclear-nav li {
    display: inline;
    font-size: 18px;
    color: #8c8079;
    position: relative;
    top: 10px;
    margin-left: 18px;
    padding-right: 18px;
    border-right: 1px solid #8c8079;
    cursor: pointer; }

  #country-nav {
    width: 100%;
    list-style-type: none;
    border-bottom: 1px solid #dadada;
    overflow: hidden;
    display: none; }

  #country-nav li {
    display: inline;
    font-size: 12px;
    position: relative;
    top: 8px;
    margin-left: 12px;
    padding: 8px 12px 8px 0px;
    border-right: 1px solid #dadada;
    font-weight: bold; }

  #country-nav li a.active {
    color: #ca0000; }

  #nav-carat {
    position: absolute;
    z-index: 999;
    bottom: -4px;
    left: 50px; }

  #nav li:last-of-type {
    border: none !important; }

  #nav li.active {
    font-weight: bold;
    color: #403A37; }

  td.confirmed {
    color: #ca0000; }

  td.unconfirmed {
    color: #ff861c; }

  td.pursuing {
    color: #FFD648; }

  .nc-key {
    display: inline;
    float: right;
    font-size: 12px;
    line-height: 16px;
    margin-top: 15px; }

  .nc-key li {
    display: inline;
    float: left;
    margin: 0 10px 0 0;
    font-weight: bold; }

  .nc-key img {
    background-color: #ca0000;
    display: inline-block;
    height: 16px;
    margin: 0 8px 0 0;
    overflow: hidden;
    vertical-align: -3px;
    width: 16px; }

  #nc-overview {
    margin: 20px 0px;
    width: 100%;
    height: auto; }

  .nc-key-country {
    font-size: 13px;
    line-height: 16px;
    margin-bottom: 15px; }

  .nc-key-country li {
    display: inline;
    margin: 0 10px 10px;
    font-weight: bold; }

  .nc-key-country img {
    background-color: #ca0000;
    display: inline-block;
    height: 16px;
    margin: 0 8px 0 0;
    overflow: hidden;
    vertical-align: -3px;
    width: 16px; }

  /* Country panel styling */
  #country-name {
    font-size: 16px;
    font-weight: bold;
    padding: 0 10px 10px; }

  .country-meta {
    width: 50%;
    padding-left: 10px;
    float: left; }

  .country-meta-full {
    width: 100%;
    padding: 10px;
    clear: both; }

  .country-meta-full h3 {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 10px; }

  .country-meta p {
    font-size: 14px;
    line-height: 18px;
    margin-top: 0;
    padding-left: 10px; }

  .country-meta h3 {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 10px; }

  #country-meta-table {
    width: 100%;
    border: 1px solid #e1e1e1;
    padding: 5px 10px;
    font-weight: bold;
    margin-bottom: 10px;
    border-collapse: collapse; }

  #country-meta-table th, #country-meta-table td {
    border: 1px solid #e1e1e1;
    padding: 5px 10px;
    font-weight: bold; }

  #country-meta-table th {
    text-transform: uppercase;
    color: #8C8079; }

  #nc-country-warheads {
    width: 53%;
    height: auto;
    border-right: 1px solid #d9d9d7;
    float: left;
    margin-right: 15px; }

  h4.metaHead {
    text-transform: uppercase;
    color: #8c8079;
    margin: 0;
    padding: 0;
    font-size: 12px; }

  .totalArsenal {
    color: #ca0000;
    padding-bottom: 4px; }

  .reserveRetire {
    color: #8c8079; }

  #nc-country-warheads ul li span {
    font-size: 16px; }

  #nc-country-warheads ul {
    list-style-type: none;
    text-transform: none;
    font-weight: bold;
    padding-right: 10px; }

  #nc-country-warheads ul li.description {
    font-weight: normal !important;
    text-transform: none !important;
    line-height: 1.5; }

  #nc-country-warheads ul li.source {
    font-weight: normal !important;
    text-transform: none !important;
    line-height: 16px;
    font-size: 12px;
    color: #666666;
    padding-top: 4px; }

  #nc-deliverymech {
    width: 310px;
    float: left; }

  #nc-deliverymech {
    float: left; }

  .nuclear-custom-item {
    margin: 0 0 15px;
    position: relative;
    height: 360px;
    padding-top: 15px;
    border-top: 1px solid #d9d9d7; }

  .nuclear-custom-item h3, .nuclear-custom-item p {
    width: 280px; }

  .nuclear-custom-item p {
    padding-left: 0px !important; }

  .nuclear-custom-item img {
    position: absolute;
    top: 15px;
    right: 0px; }

  .sourceLine {
    display: block;
    clear: both;
    font-size: 12px;
    color: #666666;
    padding: 10px;
    text-align: right;
    margin-top: 15px; } }
.source {
  font-size: .75rem;
  color: #595959;
  text-align: right; }

.cnnint-section {
  padding: 0 0 20px;
  margin: 0 0 20px;
  border-bottom: 1px solid #BFBFBF; }
  .cnnint-section img {
    padding: 0; }
    .cnnint-section img.full-width {
      max-width: 980px;
      width: 100%; }
    .cnnint-section img.left {
      max-width: 640px;
      width: 60%;
      float: left;
      padding-right: 20px; }
    .cnnint-section img.right {
      max-width: 640px;
      width: 60%;
      float: right;
      padding-left: 20px; }
  .cnnint-section .cvp-video {
    height: 0;
    position: relative;
    padding-bottom: 56.25%;
    margin-bottom: 20px; }
    .cnnint-section .cvp-video div {
      height: auto;
      max-width: 100%;
      width: 100%; }
    .cnnint-section .cvp-video video, .cnnint-section .cvp-video iframe, .cnnint-section .cvp-video object {
      height: 100%;
      left: 0;
      position: absolute;
      top: 0;
      width: 100%; }

@media screen and (max-width: 480px) {
  .cnnint-section img {
    padding: 10px 0; }
    .cnnint-section img.full-width {
      max-width: 480px;
      width: 100%; }
    .cnnint-section img.left, .cnnint-section img.right {
      max-width: 480px;
      width: 100%;
      float: none;
      padding-right: 0px;
      padding-left: 0px; } }

/*# sourceMappingURL=nuclear-weapon-states.css.map */