title: Change border color of both divs when hover on one div in css
body: <p>i have two divs and and i want if when i hover on one div, border color of both divs should be change...</p>
  
  <p>CSS :</p>
  
  <pre><code>.uperdiv {
  width:80%;
  background-color:black;
  margin-left:10%;
  border-style:none solid none solid ;
  border-width:5px; 
  border-color:#fff;
  border-top-style:none;
  height:170px;
  margin-top:-220px;
  transition:border-color 2s;
  -moz-transition:border-color 2s;
  -webkit-transition:border-color 2s;
  -o-transition:border-color 2s;
  }
  .uperdiv:hover + .lowerdiv{
  border-color:#9900ff;
  }   
  .lowerdiv {
  border-style:none solid solid solid ;
  border-color:#fff;
  border-width:5px;
  background-color:black;
  width:80%;
  border-bottom-left-radius:15px;
  border-bottom-right-radius:15px;
  height:50px;
  margin-left:10%;
  }
  </code></pre>
  
  <p>HTML</p>
  
  <pre><code>&lt;div class="uperdiv"&gt;
  Some text
  &lt;/div&gt;
  &lt;div class="lowerdiv"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I tried + sign but it changes lower div border color when i hover on uper div...and you can say that i want to create effects as of one div.
  And now i have no idea.. is there any way to do it?? 
  And plz don't use jquery and javascript only css and css3
  Thanks in advance :)</p>