@CHARSET "UTF-8";
/*
_____________________________________________________

QForma Content file
URL: http://www.qforma.nl

Styling rules for the project, this file is also loaded in the cms
to give the client the fonts, links, heading & other classes which
are used in the project.

_____________________________________________________


/*----------------------------------------------------------------------------*\
   $CLEARFIX
   Big up @necolas: nicolasgallagher.com/micro-clearfix-hack
\*----------------------------------------------------------------------------*/

   .media:before,
   .media:after,
   .island:before,
   .islet:before,
   .island:after,
   .islet:after,
   .zend_form:before,
   .zend_form:after,
   .cf:before,
   .cf:after,
   /* Legacy .clearfix class, use .cf instead */
   .clearfix:before,
   .clearfix:after{
      content: "";
      display: table;
   }

   .media:after,
   .island:after,
   .islet:after,
   .zend_form:after,
   .cf:after,
   /* Legacy .clearfix class, use .cf instead */
   .clearfix:after{
      clear: both;
   }

   .media,
   .island,
   .islet,
   .zend_form,
   .cf,
   /* Legacy .clearfix class, use .cf instead */
   .clearfix{
      zoom: 1;
   }



/* ========================================================================== */
/* ! Typography, @font-face rules, global typo styles, headings               */
/* ========================================================================== */

   /* font face */
		@font-face {
            font-family: 'CantarellRegular';
            src: url('../font/Cantarell-Regular-webfont.eot');
            src: url('../font/Cantarell-Regular-webfont.eot?#iefix') format('embedded-opentype'),
                 url('../font/Cantarell-Regular-webfont.woff') format('woff'),
                 url('../font/Cantarell-Regular-webfont.ttf') format('truetype'),
                 url('../font/Cantarell-Regular-webfont.svg#CantarellRegular') format('svg');
            font-weight: normal;
            font-style: normal;

        }


        @font-face {
            font-family: 'CantarellBold';
            src: url('../font/Cantarell-Bold-webfont.eot');
            src: url('../font/Cantarell-Bold-webfont.eot?#iefix') format('embedded-opentype'),
                 url('../font/Cantarell-Bold-webfont.woff') format('woff'),
                 url('../font/Cantarell-Bold-webfont.ttf') format('truetype'),
                 url('../font/Cantarell-Bold-webfont.svg#CantarellBold') format('svg');
            font-weight: normal;
            font-style: normal;

        }


	/* Global typo styles */
		body{
			font-family: 'CantarellRegular', Verdana, sans-serif;
			font-size: 0.85em;
			line-height: 1.6em;
			font-weight: normal;
			color: #181365;
		}

   	p{ margin-top: 0; }
   	p:last-child{ margin-bottom: 0; }

   	b,strong{
   		font-weight: bold;
   		font-family: 'CantarellBold', Verdana, sans-serif;
   	}

   	.sub{
   		font-size: 0.8em;
   		color: #999;
   	}
   	.date{
   		color: #999;
   	}


   /* headings */
   	h1, h2, h3, h4, h5, h6,
   	.h1, .h2, .h3, .h4, .h5, .h6{
   		font-family: 'CantarellRegular', Verdana, sans-serif;
   		font-weight: normal;
   		margin-top: 0;
   		margin-bottom: 0.2em;
   		line-height: normal;
   	}

   	h1, .h1{ color: #d6086a; font-size: 2.4em; }
   	h2, .h2{ color: #fff; font-size: 2.0em; text-transform: uppercase; padding: 20px 0 0 0; }
   	h3, .h3{ color: #181365; font-size: 1em; display: inline; padding: 5px 0; line-height: 1.8em;}
   	h4, .h4{ color: #d6086a; font-size: 1.6em; }
   	h5, .h5{ color: #d6086a; font-size: 1.2em; }

/* ========================================================================== */
/* ! Base                                                                     */
/* ========================================================================== */

   /* Text selection */
   ::-moz-selection { background: #06e; }
	::selection { background: #06e; }


/* ========================================================================== */
/* ! Links                                                                    */
/* ========================================================================== */

   a, a:visited{
   	color: #D6086A;
   	text-decoration: none;
   }

   a:hover{
   	color: #D6086A;
   	text-decoration: underline;
   }

   #footer a,
   #footer a:visited{
    color: #fff;
    text-decoration: none;
    font-size: 1.0em;
    font-weight: normal;
    margin: 20px 0;
   }
   #footer a:hover{
    color: #fff;
    text-decoration: underline;
   }

   .link-right{
		float: right;
	}


/* ========================================================================== */
/* ! Lists                                                                    */
/* ========================================================================== */

   /* key points */
    #key-points {
        float: left;
    }
        #key-points ul{
            width: 350px;
        }
            #key-points li{
                color: #ec1c23;
                font-size: 1.2em;
                border-bottom: #a19eab 1px solid;
                border-top: #dddae2 1px solid;
                list-style-position: inside;
            }
                #key-points li:first-child{
                    border-top: 0;
                }
                #key-points li:last-child{
                    border-bottom: 0;
                }
                    #key-points li span{

                    }

/* ========================================================================== */
/* ! home                                                                   */
/* ========================================================================== */
    #maintext{
        width: 435px;
        float: left;
        margin: 0 0 0 155px;
    }
    .view{
      overflow:hidden;
      line-height: 21.76px;
    }
    .slide{
      color: #FFF;
      float: right;
      padding: 0 25px 3px 5px;
      margin: 0 5px 0 0;
      cursor: pointer;
      background: #ec1c23 url(../gfx/down-arrow.png) no-repeat 94% 10px;
    }
      .slide.down{
        background: #ec1c23 url(../gfx/up-arrow.png) no-repeat 94% 10px;
      }
    #footer p{
        font-size: 1.0em;
        font-weight: normal;
        margin: 20px;
    }

/*----------------------------------------------------------------------------*\
   $MEDIA
   As per: stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code
\*----------------------------------------------------------------------------*/

   /* Sample markup
      <div class="media">
         <div class="img">
            <img/>
         </div>
         <div class="body"></div>
      </div>
   */
   .media{
      display: block;
   }
      .img{
         float: left;
         margin-right: 20px;
      }

      /* Reversed image location (right instead of left). */
      .img-rev{
         float: right;
         margin-left: 20px;
      }
         .img img{
            display: block;
         }

      .body{
         overflow: hidden;
      }
         .body > :last-child{
            margin-bottom: 0;
         }