/* -------------------------------------------------------------------- */
/* ----------------- general styles / resets -------------------------- */
/* -------------------------------------------------------------------- */


/*@font-face {
    font-family: 'planerregular';
    src: url('../fonts/planer_reg-webfont.eot');
    src: url('../fonts/planer_reg-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/planer_reg-webfont.woff') format('woff'),
         url('../fonts/planer_reg-webfont.ttf') format('truetype'),
         url('../fonts/planer_reg-webfont.svg#planerregular') format('svg');
    font-weight: normal;
    font-style: normal;
    }*/
@font-face {
    font-family: 'momstypewriterregular';
    src: url('../font/moms-typewriter-webfont.eot');
    src: url('../font/moms-typewriter-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/moms-typewriter-webfont.woff2') format('woff2'),
         url('../font/moms-typewriter-webfont.woff') format('woff'),
         url('../font/moms-typewriter-webfont.ttf') format('truetype'),
         url('../font/moms-typewriter-webfont.svg#momstypewriterregular') format('svg');
    font-weight: normal;
    font-style: normal;

}   
@font-face {
    font-family: 'robotoregular';
    src: url('../font/roboto-regular-webfont.eot');
    src: url('../font/roboto-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/roboto-regular-webfont.woff2') format('woff2'),
         url('../font/roboto-regular-webfont.woff') format('woff'),
         url('../font/roboto-regular-webfont.ttf') format('truetype'),
         url('../font/roboto-regular-webfont.svg#robotoregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'robotomedium';
    src: url('../font/roboto-medium-webfont.eot');
    src: url('../font/roboto-medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/roboto-medium-webfont.woff2') format('woff2'),
         url('../font/roboto-medium-webfont.woff') format('woff'),
         url('../font/roboto-medium-webfont.ttf') format('truetype'),
         url('../font/roboto-medium-webfont.svg#robotomedium') format('svg');
    font-weight: normal;
    font-style: normal;

}

    header, footer, article, section, nav, menu, hgroup {
    	display: block;
    }

    body {
    	font-family: 'robotoregular';
    	font-size: .9em	;
    	margin: 0;
    	background-image:url('../images/crubg.jpg');
    	background-size:100%;
    	background-repeat:no-repeat;
    }

    li {
    	list-style: none;
    }

    * {
    	outline: none;
        box-sizing: border-box;
    }

    a {
    	text-decoration: none;
    }

    a img {border: none; }

    ul {
    	padding: 0;
    	margin: 0;
    }

    h2, h3, h4, h5 {
    	font-weight: normal;
    	margin: 0;
    }
    p{
    	padding: 5px 15px;
line-height: 21px;
font-size: 0.8em;
text-align: justify;
    }

    /* -------------------------------------------------------------------- */
    /* ---------------------------- structure ----------------------------- */
    /* -------------------------------------------------------------------- */

    #container {
    	width: 960px;
    	margin: 0 auto 40px;
    }
    #content {
    	width: 960px;
    	margin: 0 auto;
    	height: auto;
    	min-height: 560px;
    	clear: both;
    	background-image: url("../images/col2-bg.png");
    	margin-top:10px;
    }

    /* -------------------------------------------------------------------- */
    /* ----------------------------  header   ----------------------------- */
    /* -------------------------------------------------------------------- */

    h1 {
    	text-indent: -9999px;
    	background-image: url('../images/crulogo.png');
    	background-repeat: no-repeat;
    	width: 300px;
    	height: 110px;
    	float: left;
    	margin: 0;
    	background-size:100%;
    	background-position:bottom;
    }

    header {
    	height: 110px;
    }

    header ul {
    	float: right;
    	text-align: right;
    	width: auto;
    	margin-top: 65px
    }

    header li {
    	overflow: hidden;
    	margin: 0;
    	float: left;
    }

    nav a {
    	display: inline-block;
    	color: white;
    	float: left;
    	padding: 30px 10px 0;
    	font-size:0.8em;
    }

    .last {
    	padding-right: 20px;
    }

    nav a:hover, .active a {
    	color: #000;
    }	

    /* -------------------------------------------------------------------- */
    /* -------------------------------  home  ----------------------------- */
    /* -------------------------------------------------------------------- */

    .indent {
    	text-indent: -99999px;
    	background-repeat: no-repeat;
    }

    .col {
    	float: left;
    	height: 560px;
    	overflow: hidden;
    	box-sizing:boreder-box;
    }

    /* ----------------------- col1 -----------------------*/

    .col1 {
    	width: 300px;
    	box-sizing:border-box;
    }
    .col1 p {
    	padding: 5px 15px;
    	line-height:21px;
    	font-size:0.8em;
    }

    #welcome {
    	background-image:url('../images/welcome-new.png');
    	font-family: 'momstypewriterregular';
		font-size:28px;
		text-align:center;
		padding:30px 0 15px;
		background-size:100% 100%;
    }

#donate-page{
	background-image: url("../images/crubg6.jpg");
    background-position: 50% center;
    background-size: cover;
}









    /* ----------------------- col2 -----------------------*/

    .col2 {
    	width: 360px;
    	text-align:center;
    	background-image:url('../images/col1-bg.png');
    	padding:0px 15px 0;
    	box-sizing:border-box;
    }
    .col2 h2{
    	font-family: 'robotomedium';
    	font-size:26px;
    	padding-top:12px;
    }
	.col2 p{
		margin:0;
		font-size:1em;
        line-height:  16px;  
        text-align: center;
	}
    #see {
    	background-image: url('../images/see.png');
    	width: 360px;
    	height: 60px;
    }

    .col2 video {
    	width: 360px;
    	height: 213px;
    	margin: 10px auto;
    }

    #donatepanel {
    	position: relative;
    	background-image: url('../images/donatepanel.png');
    	background-repeat: no-repeat;
    	width: 360px;
    	height: 140px;
    	margin:0;
    	text-indent: -99999px;
    }

    #donatepanel img {
    	position: absolute;
    	z-index: 2;
    	text-indent: -99999px;
    	bottom: 0;
    	left: 109px;
    }

    #donate {
    	position: relative;
    	z-index: 100;
    }

    #donate-image-area {
        margin-top: 20px;
    }
    #donate-image1{
    	width:100px;
    	height:auto;
    }
    #donate-image3{
    	width:80px;
    	height:auto;
    }
    #donate-image2{
    	width:140px;
    	height:auto;
    }
    .donate-join{
		background:none;
    	padding:0;
		font-size:16px;
		display:block;
		text-align:center;
		text-transform:uppercase;
		margin:0 auto;
		margin-top:10px;
		color:#000;
    }
    .donate-join:visited{
    	color:#000;
    }
	.donate-join img{
		height:40px;
	}
    #donate-image-area-join {
    	background-color: #000000;
    	margin-top: 140px;
    }

    #donate-image {
    	font-family: 'robotomedium';
    	background-color:#fff;
    	padding:0;
		font-size:16px;
		display:block;
		text-align:center;
		text-transform:uppercase;
		margin:0 auto;
		margin-top:0px;
		border:none;
		background:none;
    }
    object {
    	margin-left: 8px;	
    }
	#donate1, #donate2, #donate3{
		display:inline-block;
	}

    /* ----------------------- col3 -----------------------*/

    .col3 {
    	width: 300px;
    	box-sizing:border-box;
    }

    #latest {
    	font-family: "momstypewriterregular";
		font-size:16px;
		text-align:center;
		padding:40px 0 10px;
		background-image:url('../images/border.png');
		background-size:100% auto;
		background-repeat:no-repeat;
		background-position:bottom;
		color:#fff;
    }
    .arrow-box{
    	text-align:center;
    	background-image:url('../images/border.png');
		background-size:100% auto;
		background-repeat:no-repeat;
		background-position:bottom;
		padding:0 0 10px;
    }

    #posts {
    	padding: 8px 5px 5px 15px;
    	height: 455px;
    	overflow-y: scroll;
		overflow-x:hidden;
    }

    .post a {
    	text-decoration: underline;
    }

    .date {
    	color: grey;
    }

    .rss-box {
    	margin-top: 15px;	
    }

    .rss-title {
    	display: none;
    }

    .rss-item {
    	margin-bottom: 20px;	
    	font-size:0.8em;
    }
    .rss-item.special-item{
        font-size:1.2em;
    }
    .rss-item.special-item .readmore{
        display: inline-block;
    }
    .rss-items li.rss-item:first-child a{
    	color:black;
    	font-size:1.2em;
    }
    .rss-items li.rss-item:first-child{
    	color:red;
    }
    .rss-item a{
    	font-weight:700;
    	color:#000;
    	margin-bottom:-10px;
    	display:block;
    	font-size:1em;
    }
    .rss-item a:hover{
    	color:#fff;
    }

    .rss-date {
    	font-size: 11px;	
    	margin-bottom: 15px;
    }


    /* -------------------------------------------------------------------- */
    /* -------------------------------  home  ----------------------------- */
    /* -------------------------------------------------------------------- */

    #recaptcha_widget_div {
    	margin-bottom:10px;
    }

    .center-notif {
    	padding: 50px;
    	text-align: center;
    	line-height: 200%;
    }

    /* -------------------------------------------------------------------- */
    /* -------------------------------  form  ----------------------------- */
    /* -------------------------------------------------------------------- */

    #contact-form label span.form-error {
        margin: 0 0 12px;
        font-weight: 400;
        font-size: 13px;
        display:none;
    }

    #content.relative {
        position:relative;
    }
    .join-left{
    	width:660px;
    	padding-top:0px;
    	float:left;
    	height:560px;
    	box-sizing:border-box;
        position: relative;
    }
    .join-left-left{
    	width:300px;
    	padding:0px;
    	box-sizing:border-box;
    	float:left;
    	height:482px;
        padding-top: 80px;
    }
    .join-left-left ul{
        padding: 0px 15px;
        text-align: justify;
    }
    .join-left-left ul li {
        padding: 2px 0px;
        line-height: 18px;
        font-size: 0.8em;
        list-style: outside none disc;
          list-style: initial;
        margin-left: 10px;
    }
    .join-left-title{
	    font-family: "momstypewriterregular";
	    font-size: 28px;
	    padding: 10px 0 10px 15px;
        position: absolute;
	    box-sizing:border-box;
	    text-align: left;
        background-image: url("../images/welcome_header_double.png");
        background-size: 101% 100%;
        padding: 25px 0px 20px 10px;
        width: 100%;
    }
    .join-left-right{
    	width:360px;
    	padding:0px 15px;
    	box-sizing:border-box;
    	background-image: url("../images/col1-bg.png");
    	float:left;
    	text-align:center;
    	height:482px;
        height: 100%;
        padding-top: 80px;
    }
    .join-left-right-left{
        width:360px;
        padding:0px 15px;
        box-sizing:border-box;
        background-image: url("../images/col1-bg.png");
        float:left;
        height:482px;
        height: 100%;
        padding-top: 80px;  
    }
    .join-left-right-left ul {
        text-align: justify;
    }

   .join-left-right-left ul li{
        list-style: outside none disc;
          list-style: initial;
        padding: 2px 0px;
line-height: 18px;
        font-size: 0.8em;
        margin-left: 10px;
    }
    .join-left-right-left p{
        margin:2px 0px 0px;
        padding: 0px;
    }
    .join-right{
    	width:300px;
    	float:left;
    	height:482px;
    }
    .donate-right{
    	width:300px;
    	float:left;
    	height:560px;
    }
    .donate-title{
    	font-weight:700;
    	margin-bottom:20px;
    }
    .options{
    	padding:0 0 0 40px;
    	background-image:url('../images/ck-box.png');
    	background-position:0px 8px;
    	background-repeat:no-repeat;
    	margin-bottom:20px;
    	line-height:24px;
    }
    .join-donate-button{
    	margin-top: 12px;
    }

    @media (max-width: 900px) {
    body{
        background-size: 100% 100%;
       /* background-attachment: fixed;*/
    }
    #container,#content{
    width: 100% !important;
    overflow: auto;
    }
    nav {
        float: right;
    }

    nav ul {
        width: auto;
    }
    .join-left,.join-right{
        width:  100%;
        height: auto !important;   
    }

    .join-left-left,.join-left-right, .join-left-right-left{
        width:50%;
    }

    .join-left-left {
        height: auto;   
    }
    #contact-form input[type="text"], #contact-form input[type="email"], #contact-form input[type="tel"], #contact-form input[type="url"], #contact-form textarea{
        width:  100% !important;
    }
    #recaptcha_area{
        float: none !important;
        margin: auto !important;
    }
    #contact-form button[type="submit"]{
        float:  none !important;
        width:  50% !important;
        margin-left:    25% !important;
    }

    .fullhalf {
        width:  100% !important ;
    }



    }

@media (max-width: 650px) {
     .join-left-left,.join-left-right, .join-left-right-left{
        width:100%;
        padding-top: 5px;
    }
    .join-left-title{
        position: static;  
    }
    .col1, .col2, .col3{
        width: 100%;
        height: auto;
        padding: 10px 0px;
    }
    #posts{
        height: auto;
        overflow: visible;  
    }
    .col3 .arrow-box{
        display:  none;
    }

    header ul{
        margin-top: 0px;
        text-align: center;
        padding: 20px 0px 10px;
    }
    #contact-form{
        width:  100% !important;
    }
    #contact-form button[type="submit"]{
        margin-top: 5px !important;
    }
    .halfwidth {
    float: left;
    width: 100% !important;
}
.peopleul{
    overflow: visible !important;
    padding-top: 0px !important;
}
#container{
    margin-bottom: 0px;
}
nav a{
    padding: 0px 5px;
}
header li{
display: inline-block;
float: none;
}




/**donation page style**/
#contact-form div{
	width:100%;
	margin:0px !important;
}
#donate-page .payment-content{
	  background-image: url("../images/col2-bg.png") !important; 
}
.payment-content #contact-form{
	margin-top:10px !important;
}
.donate-page-heading{
	width:100% !important;
}
#contact-form label .contact-field-heading.even-field{
	margin:10px 0 10px 0 !important;
}
#contact-form label .contact-field-heading{
	margin-top:10px !important;
	font-size:10px !important;
}
.dnjoin-box label{
	margin-top:20px !important;
}
.donate-right-box .pay-box{
	width:100% !important;
}
.donate-right-box{
	height:auto !important;
}
}