@import "/css/base.css";

/*
 * Global styles
 */
 
    a, a:visited {
        color: #662483;
        text-decoration: none;
         }
         a:hover {
            color: #E6007E;
             }
             
    p {
         margin: 8px 0;
         }
    p.more {
        text-indent: 26px;
        background: url('/img/raquo.gif') no-repeat 0 8px;
        line-height: 20px;
        margin: 20px 0 5px 10px;
        }
        p.more a {
            border-bottom: 1px solid #A9A9A9;
            color: #535353;
            }
            
	menu li {
		list-style-type: none;
		}
		
    input, 
    select,
   	textarea {
    	border: 1px solid #C1C1C1;
		width: 50%;
   		padding: 0 5px;
   		border-radius:3px;
    	}
    	textarea {
    		padding-top: 5px;
    		padding-bottom: 5px;
    		}
    textarea {
    	width:100%;
    } 
    input, 
    select {
   		height: 23px;
    	}
	    input:focus, 
	    textarea:focus, 
	    select:focus {
	    	background: #EDEDED;
	    	}
	    input[type=submit], 
	    input[type=checkbox], 
	    input[type=radio], 
	    select {
	    	width: auto !important;
	    	}
	    input[type=submit],
	    button {
	    	background-color: #662383;
    		background-repeat: repeat-x;
    		background-position: top;
	        -moz-border-radius: 4px;
	        -webkit-radius: 4px;
	        border-radius: 4px;
	        min-height: 27px;
	        padding: 5px 10px;
	        color: #fff;
	        border: 0;
	    	}
	    	input[type=submit]:hover {
	    		background-image: url('/img/button_bg.png');
	    		}


 
/*
 * Main sructure
 */
 
	header {
        height: 148px;
        padding-top: 25px;
		}
		
	#main {
        margin-top: 20px;
        margin-bottom: 50px;
        padding: 32px;
        position: relative;
		}
		#main .inner-content {
			min-height: 400px;
			display: block;
			}
		
    .content-wrap {
        width: 988px;
        margin-left: auto;
        margin-right: auto;
        position: relative;
        }
        
    #menu-wrap {
        position: absolute;
        height: 60px;
        width: 100%;
        bottom: 0;
    	}
    	
   	section.content {
   		width: 612px;
   		float: right;
   		}
   		
	footer .copy {
       	position: absolute;
       	bottom: 0;
		}
	footer .copy h2 {
		font-size:10px;
	}
	footer #footer-menu-wrap {
		float: right;
		width: 620px;
		position: relative;
		}
	footer #footer-menu-wrap .col1 li a:hover, footer #footer-menu-wrap .col2 li a:hover, footer #footer-menu-wrap .col3 li a:hover{
		color:#662483;
	}	
		footer #footer-menu-wrap menu {
			float: left;
			}
			footer #footer-menu-wrap menu.col1 {
				width: 260px;
				}
			footer #footer-menu-wrap menu.col2 {
				width: 208px;
				}
			footer #footer-menu-wrap menu.col3 {
				}
 
/*
 * Main mark-up
 */

    body { 
        background: #F5F5F5;
        line-height: 18px;
        }
    
    header {
        background: #fff;
        position: relative;
        }
        header a.logo{
        	float:left;
        	margin-top:5px;
            text-indent: -9999px;
            overflow: hidden;
            outline: 0;
            background: url('/img/VerderIC_logo.png') no-repeat;
            margin-left: 27px;
            width: 220px;
            height: 60px;
            display: block;
            }
        header h1 {
        	float:right;
        	font-family:sans-serif;
        	color:#743290;
        	margin-top:23px;
        	margin-left:55px;
        	font-size:16px;
        }
        header .flags {
            position: absolute;
            right: 34px;
            top: 50%;
            }
            
    form {
    	margin: 30px 0;
    	}
	    form div.item {
	    	margin: 0 0 10px;
	    	}
		    form div.item p {
		    	margin: 0;
		    	font-weight: bold;
		    	}
		    form div.item .element {
		    	margin: 2px 0 0;
		    	}
    	form ul.errors {
    		color: red;
    		}
    #main {
        background: #FFFFFF;
        box-shadow: 0px 0px 6px #ccc;
    	}
		#main .copy {
			color: #662483;
			}
    
    #menu-wrap {
        background: url('/img/menu_bg.gif') repeat-x;
        text-align: center;
        }
        #menu-wrap #menu-spots {
            position: absolute;
            z-index: 1;
            top: 0;
            left: 50%;
            margin-left: -435px;
            }
    header menu {
        height: 40px;
        background: #fff;
        z-index: 2;
        margin-top: 10px;
        border: 1px solid #fff;
        }
        header menu li {
            float: left;
            position: relative;
            padding: 0 60px;
            line-height: 40px;
            height: 100%;
            border-left: 0;
            border-right: 0;
            overflow: visible;
            }
	        header menu li .collapse {
	        	background: url('/img/collapse.png') no-repeat right top;
	        	
	        	width: 14px;
	        	height: 7px;
	        	display: inline-block;
	        	margin-bottom: 2px;
	        	}
	        	header menu li:hover .collapse {
	        		background-position: right bottom;
	        		}
            header menu li > a, header menu li > a:visited {
                font-size: 17px;
                border-bottom: 2px solid transparent;
                font-weight: bold;
                }
                header menu li:hover > a, header menu li > a:hover {
                    color: #E6007E;
                    }
                	header menu li > a:hover {
                    	
                		}
                    
                header menu li .submenu {
                    position: absolute;
                    left: 0;
                    top: 100%;
                    display: none;
                    text-align: left;
                    padding: 12px 20px 12px 20px;
                    line-height: 28px;
                    border: 1px solid #fff;
                    margin-left:35px;
                    box-shadow: 0px 3px 3px rgba(0,0,0,0.25);
                    border-radius:5px;
                    margin-top:-5px;
                    }
                    header menu li:hover .submenu, header menu li .submenu:hover {
                        display: block;
                        }
                        header menu li .submenu .bg {
                            width: 100%;
                            height: 100%;
                            top: 0;
                            left: 0;
                            z-index: 1;
                            background: #fff;
                            opacity: 1;
                            position: absolute;
                            }
                        header menu li .submenu dl {
                            position: relative;
                            z-index: 2;
                            white-space: nowrap;
                            }
                            header menu li .submenu dl a {
                                font-weight: bold;
                                }
                                header menu li .submenu dl a:hover {
                                    }

        aside {
            float: left;
            }
            aside .block {
                width: 266px;
                margin-bottom: 20px;
                }
                aside .block hr {
                	width:100%;
                	float:left;
                	color:#eee;
                	background-color:#eee;
                	border:none;
                }
                aside .block .photo {
                	float:left;
                	width:55px;
                	height:55px;
                	border-radius:5px;
                	background: #fff url('/img/victordevilee.jpg') center center;
                	background-size: contain;
                }    
                 aside .block .photo2 {
                	float:left;
                	width:55px;
                	height:55px;
                	border-radius:5px;
                	background: #eee;
                	background: #fff url('/img/petradevilee.jpg') center center;
                	background-size: contain;
                }    
            	aside .block .contact-info {
            		float:left;
                		
            	}
        		aside .block .contact-info h3{
            		color:#743290;
            		margin-bottom:5px;                		
            	}
                aside .block .title {
                	float:left;
                	width:195px;
                	margin-left:15px;
                }
                aside .block .title h2 {
                	color:#743290;
                    margin: 9px 0 0px;
                    }
                aside .block .title h3 {
                    margin: 0px 0 10px;
                    font-size:12px;
                    }
                aside .block.reference h2 {
                    font-weight: normal;
                    }
                aside .block .reference {
                    font-weight: bold;
                    margin: 14px 0 24px;
                    }
                aside .block .quote {
                    font-style: italic;
                    padding-bottom: 3px;
                    font-size: 11px;
            		line-height: 22px;
                    letter-spacing: 1px;
                    }

        aside section.contact p {
            line-height: 22px;
            margin: 10px 0;
        	}
        	aside section.contact p:last-child {
        		margin-bottom: 0;
        		}
       	aside section.contact a {
       		color: #333;
       		}
       	aside section.contact a:hover {
       		text-decoration:underline;
       		color:#743290;
       	}
       		
        aside section#submenu {
        	padding-left: 0;
        	padding-right: 0;
        	width: 270px;
        	background:#fff;
        	border:1px solid #eee;
        	border-bottom:none;
        	font-weight:bold;
        	border-radius:5px;
        	}
	        aside section#submenu ul {
	            line-height: 22px;
	            list-style: none;
	            margin: 0;
	        	}
		        aside section#submenu ul li {
		            padding: 0;
		        	}
		        	aside section#submenu ul li a {
			            line-height: 40px;
			            height: 40px;
			            margin: 0px 0;
			            border-bottom:1px solid #eee;
			            display: block;
			            color: #535353;
			            padding: 0 12px;
		        		}
		        		aside section#submenu ul li a:hover {
		        			background: #fff;
		        			color: #E6007E;
		        			text-decoration: none;
		        			background:#F5F5F5;
		        			}
       		
		.breadcrumb {
			margin-bottom: 28px;
			color: #c1c1c1;
			}
			.breadcrumb p {
				margin: 0;
				border: 1px solid #C1C1C1;
				position: relative;
				height: 22px;
		        -moz-border-radius: 4px;
		        -webkit-radius: 4px;
		        border-radius: 4px;
		        margin-right: 30px;
		        float: left;
				}
				.breadcrumb p a {
					}
					.breadcrumb p a:hover {
						color: #C1C1C1;
						}
					.breadcrumb p em {
						background: #D7D7D7 url('/img/breadcrumb-1-separator.png') no-repeat right top;
						padding: 0 18px 0 7px;
						color: #fff;
						float: left;
						height: 22px;
						font-style: normal;
						font-weight: bold;
						}
					.breadcrumb p span {
						background: #fff url('/img/breadcrumb-2-separator.png') no-repeat right top;
						float: left;
						padding: 0 32px 0 8px;
						margin-right: -23px;
						}
			.breadcrumb a {
				vertical-align: middle;
				color: #c1c1c1;
				line-height: 22px;
				clear: right;
				padding-bottom: 2px;
				}
				.breadcrumb a:hover {
					color: #333;
					}
		
	footer {
		margin-top: 25px;
		position: relative;
		line-height: 22px;
		}
		
		footer #footer-menu-wrap {
			padding-top: 25px;
			border-top: 1px solid #c1c1c1;
			}
		footer #footer-menu-wrap img.ruler-decoration {
			top: -10px;
			left: 50%;
			position: absolute;
			margin-left: -14px;
			}
		footer #footer-menu-wrap menu a, footer #footer-menu-wrap menu a:visited {
			color: #535353;
			}
	
/*
 * Objects
 */
 
    .rounded-small {
        -moz-border-radius: 4px;
        -webkit-radius: 4px;
        border-radius: 4px;
        }
        
	section.heading-block {
		background: #7C3996 url('/img/heading-block-bg.png') repeat-x top;
		padding: 1px;
        -moz-border-radius: 4px;
        -webkit-radius: 4px;
        border-radius: 4px;
        border: 1px solid #743290;
        color: #fff;
		font-size: 14px;
		}
		.content section.heading-block h1 {
			font-size: 18px;
			margin: 0 0 26px;
			color:#fff;
			}
		.content section.heading-block a {
        	color: #fff;
			}
		.content section.heading-block a:hover {
        	text-decoration:underline;
			}	
		.content section.heading-block .inner {
			background: url('/img/heading-block-logo-bg.png') no-repeat bottom right;
			padding: 30px 180px 30px 30px;
			}
			.content section.heading-block ul {
				margin: 20px 0 0;
				list-style-image: url('/img/heading-block-li.png');
				}
				.content section.heading-block ul li {
					line-height: 36px;
					color:#fff;
					}
        
/*
 * Content styles
 */
				
	section.content {
		color: #333;
		line-height: 22px;
		border-left: 1px solid #eee;
		padding-left:20px;
		}
	section.content h1, section.content h2 {
		margin: 20px 0 22px;
		font-size: 18px;
		color:#E6007E;
		}
	section.content p {
		color:#333;
		}
	section.content strong {
		color:#743290;
		}		
	section.content ul {
		padding-left: 20px;
		list-style-image: url('/img/raquo.gif');
		}
		section.content ul li {
			line-height: 20px;
			padding-left: 10px;
			color:#333;
			}
        
/*
 * Contact styles
 */
				
	section.contact-form {
		color: #662483;
		line-height: 22px;
		}
	section p.notice {
		width: 560px;
		background: #eee;
		padding: 20px;
		color: #E6007E;
		border: 1px solid #ccc;
		border-radius: 5px;
		font-weight:bold;

	}


/*
 * Media queries for responsive design
 * These follow after primary styles so they will successfully override. 
 */

@media all and (orientation:portrait) { 
  /* Style adjustments for portrait mode goes here */
  
}

@media all and (orientation:landscape) { 
  /* Style adjustments for landscape mode goes here */
  
}

/* Grade-A Mobile Browsers (Opera Mobile, iPhone Safari, Android Chrome)  
   Consider this: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/ */
@media screen and (max-device-width: 480px) {
  
  
  /* Uncomment if you don't want iOS and WinMobile to mobile-optimize the text for you
     j.mp/textsizeadjust 
  html { -webkit-text-size-adjust:none; -ms-text-size-adjust:none; } */
}

/* 
 * print styles
 * inlined to avoid required HTTP connection www.phpied.com/delay-loading-your-print-css/ 
 */
@media print {
  * { background: transparent !important; color: #444 !important; text-shadow: none !important; }
  a, a:visited { color: #444 !important; text-decoration: underline; }
  a:after { content: " (" attr(href) ")"; } 
  abbr:after { content: " (" attr(title) ")"; }
  .ir a:after { content: ""; }  /* Don't show links for images */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */ 
  tr, img { page-break-inside: avoid; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3{ page-break-after: avoid; }
}